Skip to content

Commit a3640cd

Browse files
aagarwal1012aagarwal1012
committed
Merge branch 'pageViewModel_advance' of https://github.com/taljacobson/IntroViews-Flutter into taljacobson-pageViewModel_advance
2 parents d646f8f + b8ef6be commit a3640cd

File tree

5 files changed

+101
-123
lines changed

5 files changed

+101
-123
lines changed

‎README.md‎

Lines changed: 14 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -49,19 +49,16 @@ You should then run `flutter packages get` in your terminal so as to get the pac
4949

5050
```dart
5151
Final page = new PageViewModel(
52-
pageColor: const Color(0xFF607D8B),
53-
mainImageAssetPath: 'assets/taxi.png',
54-
title: 'Cabs',
55-
body: 'Easy cab booking at your doorstep with cashless payment system',
56-
iconImageAssetPath: 'assets/taxi-driver.png',
57-
titleTextColor: Colors.white,
58-
bodyTextColor: Colors.white,
59-
iconColor: null,
60-
titleTextSize: 54.0,
61-
bodyTextSize: 24.0,
62-
fontFamily: "MyFont",
63-
pageTitleBold: false,
64-
bubbleBackgroundColor: Colors.white,
52+
pageColor: const Color(0xFF607D8B),
53+
title: Text('Cabs'),
54+
mainImage: Image.asset('assets/taxi.png'),
55+
body: Text(
56+
'Easy cab booking at your doorstep with cashless payment system',
57+
),
58+
textStyle: TextStyle(fontFamily: 'MyFont'),
59+
iconImageAssetPath: 'assets/taxi-driver.png',
60+
bubbleBackgroundColor: Colors.white,
61+
iconColor: null,
6562
);
6663
```
6764

@@ -95,18 +92,13 @@ You should then run `flutter packages get` in your terminal so as to get the pac
9592
| Dart attribute | Datatype | Description | Default Value |
9693
| :---------------- | :------------------------------ | :----------------------------------------------------------- | :-----------: |
9794
| pageColor | Color | Set color of the page. | Null |
98-
| mainImageAssetPath | String | Set the main image asset path of the page. | Null |
99-
| title | String | Set the title text of the page. | Null |
100-
| body | String | Set the body text of the page. | Null |
95+
| mainImage | Image | Set the main image of the page. | Null |
96+
| title | Text | Set the title text of the page. | Null |
97+
| body | Text | Set the body text of the page. | Null |
10198
| iconImageAssetPath | String | Set the icon image asset path that would be displayed in page bubble. | Null |
102-
| titleTextColor | Color | Set the title text color. | Colors.white |
103-
| bodyTextColor | Color | Set the body text color. | Colors.white |
10499
| iconColor | Color | Set the page bubble icon color. | Null |
105100
| bubbleBackgroundColor | Color | Set the page bubble background color. | Colors.white |
106-
| fontFamily | String | Use your own custom font to style the title and body. | Default |
107-
| pageTitleBold | Bool | Set the title font weight to bold. | False |
108-
| titleTextSize | Double | Set the size of title text. | 34.0 |
109-
| bodyTextSize | Double | Set the size of body text. | 18.0 |
101+
| textStyle | TextStyle | set TextStyle for both title and body | title: `color: Colors.white , fontSize: 50.0` <br> body: `color: Colors.white , fontSize: 24.0` |
110102

111103
### IntroViewFlutter Class
112104

‎example/lib/main.dart‎

Lines changed: 27 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -11,52 +11,44 @@ class App extends StatelessWidget {
1111
//making list of pages needed to pass in IntroViewsFlutter constructor.
1212
final pages = [
1313
new PageViewModel(
14-
pageColor: const Color(0xFF03A9F4),
15-
mainImageAssetPath: 'assets/airplane.png',
16-
title: 'Flights',
17-
body:
14+
pageColor: const Color(0xFF03A9F4),
15+
iconImageAssetPath: 'assets/air-hostess.png',
16+
iconColor: null,
17+
bubbleBackgroundColor: Colors.blue[900],
18+
body: Text(
1819
'Haselfree booking of flight tickets with full refund on cancelation',
19-
iconImageAssetPath: 'assets/air-hostess.png',
20-
titleTextColor: Colors.white,
21-
bodyTextColor: Colors.white,
22-
fontFamily: "MyFont",
23-
titleTextSize: 50.0,
24-
bodyTextSize: 24.0,
25-
iconColor: null,
26-
pageTitleBold: false,
27-
bubbleBackgroundColor: Colors.white,
28-
),
20+
),
21+
title: Text(
22+
'Flights',
23+
style: TextStyle(color: Colors.white70),
24+
),
25+
textStyle: TextStyle(fontFamily: 'MyFont'),
26+
mainImage: Image.asset(
27+
'assets/airplane.png',
28+
)),
2929
new PageViewModel(
3030
pageColor: const Color(0xFF8BC34A),
31-
mainImageAssetPath: 'assets/hotel.png',
32-
title: 'Hotels',
33-
body:
34-
'We work for the comfort , enjoy your stay at our beautiful hotels',
3531
iconImageAssetPath: 'assets/waiter.png',
36-
titleTextColor: Colors.white,
37-
bodyTextColor: Colors.white,
3832
iconColor: null,
39-
titleTextSize: 54.0,
40-
bodyTextSize: 24.0,
41-
fontFamily: "MyFont",
42-
pageTitleBold: false,
43-
bubbleBackgroundColor: Colors.white,
33+
bubbleBackgroundColor: Colors.green[900],
34+
body: Text(
35+
'We work for the comfort , enjoy your stay at our beautiful hotels',
36+
),
37+
title: Text('Hotels'),
38+
mainImage: Image.asset('assets/hotel.png'),
39+
textStyle: TextStyle(fontFamily: 'MyFont'),
4440
),
4541
new PageViewModel(
4642
pageColor: const Color(0xFF607D8B),
47-
mainImageAssetPath: 'assets/taxi.png',
48-
title: 'Cabs',
49-
body:
50-
'Easy cab booking at your doorstep with cashless payment system',
5143
iconImageAssetPath: 'assets/taxi-driver.png',
52-
titleTextColor: Colors.white,
53-
bodyTextColor: Colors.white,
5444
iconColor: null,
55-
titleTextSize: 54.0,
56-
bodyTextSize: 24.0,
57-
fontFamily: "MyFont",
58-
pageTitleBold: false,
5945
bubbleBackgroundColor: Colors.white,
46+
body: Text(
47+
'Easy cab booking at your doorstep with cashless payment system',
48+
),
49+
title: Text('Cabs'),
50+
mainImage: Image.asset('assets/taxi.png'),
51+
textStyle: TextStyle(fontFamily: 'MyFont'),
6052
),
6153
];
6254

‎lib/Models/page_view_model.dart‎

Lines changed: 45 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -3,34 +3,53 @@ import 'package:flutter/material.dart';
33
//view model for pages
44

55
class PageViewModel {
6+
/// Page BackGround Color
67
final Color pageColor;
7-
//main image path
8-
final String mainImageAssetPath;
9-
final String title;
10-
final String body;
8+
9+
///icon image path
1110
final String iconImageAssetPath;
12-
final Color titleTextColor;
13-
final Color bodyTextColor;
11+
12+
/// iconColor
1413
final Color iconColor;
14+
15+
/// color for background of progress bubbles
16+
///
17+
/// @Default `const Color(0x88FFFFFF)`
1518
final Color bubbleBackgroundColor;
16-
final String fontFamily;
17-
final bool pageTitleBold;
18-
final double titleTextSize;
19-
final double bodyTextSize;
20-
21-
PageViewModel({
22-
this.pageColor,
23-
this.mainImageAssetPath,
24-
this.title,
25-
this.body,
26-
this.iconImageAssetPath,
27-
this.bodyTextColor = const Color(0x88FFFFFF),
28-
this.titleTextColor = const Color(0x88FFFFFF),
29-
this.bubbleBackgroundColor = const Color(0x88FFFFFF),
30-
this.iconColor,
31-
this.fontFamily,
32-
this.pageTitleBold = false,
33-
this.titleTextSize = 34.0,
34-
this.bodyTextSize = 18.0,
35-
});
19+
20+
/// Text widget for the title
21+
///
22+
/// @Default style `color: Colors.white , fontSize: 50.0`
23+
final Text title;
24+
25+
/// Text widget for the title
26+
///
27+
/// @Default style `color: Colors.white, fontSize: 24.0`
28+
final Text body;
29+
30+
/// set default TextStyle for both title and body
31+
final TextStyle textStyle;
32+
33+
/// Image Widget
34+
final Image mainImage;
35+
36+
PageViewModel(
37+
{this.pageColor,
38+
this.iconImageAssetPath,
39+
this.bubbleBackgroundColor = const Color(0x88FFFFFF),
40+
this.iconColor,
41+
@required this.title,
42+
@required this.body,
43+
@required this.mainImage,
44+
this.textStyle});
45+
46+
TextStyle get titleTextStyle {
47+
return new TextStyle(color: Colors.white, fontSize: 50.0)
48+
.merge(this.textStyle);
49+
}
50+
51+
TextStyle get bodyTextStyle {
52+
return new TextStyle(color: Colors.white, fontSize: 24.0)
53+
.merge(this.textStyle);
54+
}
3655
}

‎lib/UI/page.dart‎

Lines changed: 14 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -100,15 +100,10 @@ class _BodyPageTransform extends StatelessWidget {
100100
new Matrix4.translationValues(0.0, 30.0 * (1 - percentVisible), 0.0),
101101
child: new Padding(
102102
padding: const EdgeInsets.only(bottom: 75.0, left: 10.0, right: 10.0),
103-
child: new Text(
104-
pageViewModel.body,
105-
textAlign: TextAlign.center,
106-
style: new TextStyle(
107-
color: pageViewModel.bodyTextColor,
108-
fontSize: pageViewModel.bodyTextSize,
109-
fontFamily: pageViewModel.fontFamily,
110-
), //TextStyle
111-
), //Text
103+
child: DefaultTextStyle.merge(
104+
style: pageViewModel.bodyTextStyle,
105+
textAlign: TextAlign.center,
106+
child: pageViewModel.body),
112107
), //Padding
113108
);
114109
}
@@ -129,22 +124,13 @@ class _ImagePageTransform extends StatelessWidget {
129124
Widget build(BuildContext context) {
130125
return new Transform(
131126
//Used for vertical transformation
132-
transform:
133-
new Matrix4.translationValues(0.0, 50.0 * (1 - percentVisible), 0.0),
134-
child: new Padding(
127+
transform: new Matrix4.translationValues(
128+
0.0, 50.0 * (1 - percentVisible), 0.0),
129+
child: new Container(
130+
width: 285.0,
131+
height: 285.0,
135132
padding: new EdgeInsets.only(bottom: 30.0),
136-
child: (pageViewModel.mainImageAssetPath != null &&
137-
pageViewModel.mainImageAssetPath != "")
138-
? new Image.asset(
139-
pageViewModel.mainImageAssetPath,
140-
width: 285.0,
141-
height: 285.0,
142-
alignment: Alignment.center,
143-
)
144-
: new Container(
145-
height: 285.0,
146-
width: 285.0,
147-
) //Loading main icon
133+
child: pageViewModel.mainImage, //Loading main
148134
), //Padding
149135
);
150136
}
@@ -171,21 +157,10 @@ class _TitlePageTransform extends StatelessWidget {
171157
child: new Padding(
172158
padding: new EdgeInsets.only(
173159
top: 60.0, bottom: 30.0, left: 10.0, right: 10.0),
174-
child: new Text(
175-
pageViewModel.title,
176-
style: (pageViewModel.pageTitleBold)
177-
? new TextStyle(
178-
color: pageViewModel.titleTextColor,
179-
fontFamily: pageViewModel.fontFamily,
180-
fontWeight: FontWeight.bold,
181-
fontSize: pageViewModel.titleTextSize,
182-
)
183-
: new TextStyle(
184-
color: pageViewModel.titleTextColor,
185-
fontFamily: pageViewModel.fontFamily,
186-
fontSize: pageViewModel.titleTextSize,
187-
), //TextStyle
188-
), //Text
160+
child: DefaultTextStyle.merge(
161+
style: pageViewModel.titleTextStyle,
162+
child: pageViewModel.title,
163+
),
189164
), //Padding
190165
);
191166
}

‎lib/UI/page_bubble.dart‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ class PageBubble extends StatelessWidget {
3434
color: viewModel.isHollow
3535
? viewModel.bubbleBackgroundColor
3636
.withAlpha((0x88 * viewModel.activePercent).round())
37-
: const Color(0x88FFFFFF),
37+
: viewModel.bubbleBackgroundColor.withOpacity(lerpDouble(0.5, 1.0, viewModel.activePercent)),
3838
border: new Border.all(
3939
color: viewModel.isHollow
4040
? viewModel.bubbleBackgroundColor.withAlpha(

0 commit comments

Comments
 (0)