Skip to content

Commit d2f1d2d

Browse files
aliasgar4558aliasgar4558
authored
[flutter_adaptive_scaffold] : 🐛 [FIX] : Issue: 121135. (flutter#3253)
[flutter_adaptive_scaffold] : � [FIX] : Issue: 121135.
1 parent 74fd094 commit d2f1d2d

9 files changed

Lines changed: 368 additions & 104 deletions

File tree

‎packages/flutter_adaptive_scaffold/CHANGELOG.md‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,8 @@
1-
## NEXT
1+
## 0.1.1
2+
3+
* Fixes flutter/flutter#121135) `selectedIcon` parameter not displayed even if it is provided.
4+
5+
## 0.1.0+1
26

37
* Aligns Dart and Flutter SDK constraints.
48

‎packages/flutter_adaptive_scaffold/README.md‎

Lines changed: 73 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -49,40 +49,60 @@ animation should use AdaptiveLayout.
4949
)
5050
];
5151
52-
return BottomNavigationBarTheme(
53-
data: const BottomNavigationBarThemeData(
54-
unselectedItemColor: Colors.black,
55-
selectedItemColor: Colors.black,
56-
backgroundColor: Colors.white,
52+
return AdaptiveScaffold(
53+
// An option to override the default breakpoints used for small, medium,
54+
// and large.
55+
smallBreakpoint: const WidthPlatformBreakpoint(end: 700),
56+
mediumBreakpoint: const WidthPlatformBreakpoint(begin: 700, end: 1000),
57+
largeBreakpoint: const WidthPlatformBreakpoint(begin: 1000),
58+
useDrawer: false,
59+
selectedIndex: _selectedTab,
60+
onSelectedIndexChange: (int index) {
61+
setState(() {
62+
_selectedTab = index;
63+
});
64+
},
65+
destinations: const <NavigationDestination>[
66+
NavigationDestination(
67+
icon: Icon(Icons.inbox_outlined),
68+
selectedIcon: Icon(Icons.inbox),
69+
label: 'Inbox',
5770
),
58-
child: AdaptiveScaffold(
59-
// An option to override the default breakpoints used for small, medium,
60-
// and large.
61-
smallBreakpoint: const WidthPlatformBreakpoint(end: 700),
62-
mediumBreakpoint:
63-
const WidthPlatformBreakpoint(begin: 700, end: 1000),
64-
largeBreakpoint: const WidthPlatformBreakpoint(begin: 1000),
65-
useDrawer: false,
66-
destinations: const <NavigationDestination>[
67-
NavigationDestination(icon: Icon(Icons.inbox), label: 'Inbox'),
68-
NavigationDestination(
69-
icon: Icon(Icons.article), label: 'Articles'),
70-
NavigationDestination(icon: Icon(Icons.chat), label: 'Chat'),
71-
NavigationDestination(
72-
icon: Icon(Icons.video_call), label: 'Video')
73-
],
74-
body: (_) => GridView.count(crossAxisCount: 2, children: children),
75-
smallBody: (_) => ListView.builder(
76-
itemCount: children.length,
77-
itemBuilder: (_, int idx) => children[idx],
78-
),
79-
// Define a default secondaryBody.
80-
secondaryBody: (_) =>
81-
Container(color: const Color.fromARGB(255, 234, 158, 192)),
82-
// Override the default secondaryBody during the smallBreakpoint to be
83-
// empty. Must use AdaptiveScaffold.emptyBuilder to ensure it is properly
84-
// overridden.
85-
smallSecondaryBody: AdaptiveScaffold.emptyBuilder));
71+
NavigationDestination(
72+
icon: Icon(Icons.article_outlined),
73+
selectedIcon: Icon(Icons.article),
74+
label: 'Articles',
75+
),
76+
NavigationDestination(
77+
icon: Icon(Icons.chat_outlined),
78+
selectedIcon: Icon(Icons.chat),
79+
label: 'Chat',
80+
),
81+
NavigationDestination(
82+
icon: Icon(Icons.video_call_outlined),
83+
selectedIcon: Icon(Icons.video_call),
84+
label: 'Video',
85+
),
86+
NavigationDestination(
87+
icon: Icon(Icons.home_outlined),
88+
selectedIcon: Icon(Icons.home),
89+
label: 'Inbox',
90+
),
91+
],
92+
body: (_) => GridView.count(crossAxisCount: 2, children: children),
93+
smallBody: (_) => ListView.builder(
94+
itemCount: children.length,
95+
itemBuilder: (_, int idx) => children[idx],
96+
),
97+
// Define a default secondaryBody.
98+
secondaryBody: (_) => Container(
99+
color: const Color.fromARGB(255, 234, 158, 192),
100+
),
101+
// Override the default secondaryBody during the smallBreakpoint to be
102+
// empty. Must use AdaptiveScaffold.emptyBuilder to ensure it is properly
103+
// overridden.
104+
smallSecondaryBody: AdaptiveScaffold.emptyBuilder,
105+
);
86106
}
87107
}
88108
```
@@ -129,6 +149,12 @@ displayed and the entrance animation and exit animation.
129149
inAnimation: AdaptiveScaffold.leftOutIn,
130150
key: const Key('Primary Navigation Medium'),
131151
builder: (_) => AdaptiveScaffold.standardNavigationRail(
152+
selectedIndex: selectedNavigation,
153+
onDestinationSelected: (int newIndex) {
154+
setState(() {
155+
selectedNavigation = newIndex;
156+
});
157+
},
132158
leading: const Icon(Icons.menu),
133159
destinations: destinations
134160
.map((_) => AdaptiveScaffold.toRailDestination(_))
@@ -139,6 +165,12 @@ displayed and the entrance animation and exit animation.
139165
key: const Key('Primary Navigation Large'),
140166
inAnimation: AdaptiveScaffold.leftOutIn,
141167
builder: (_) => AdaptiveScaffold.standardNavigationRail(
168+
selectedIndex: selectedNavigation,
169+
onDestinationSelected: (int newIndex) {
170+
setState(() {
171+
selectedNavigation = newIndex;
172+
});
173+
},
142174
extended: true,
143175
leading: Row(
144176
mainAxisAlignment: MainAxisAlignment.spaceAround,
@@ -184,11 +216,14 @@ displayed and the entrance animation and exit animation.
184216
key: const Key('Bottom Navigation Small'),
185217
inAnimation: AdaptiveScaffold.bottomToTop,
186218
outAnimation: AdaptiveScaffold.topToBottom,
187-
builder: (_) => BottomNavigationBarTheme(
188-
data: const BottomNavigationBarThemeData(
189-
selectedItemColor: Colors.black),
190-
child: AdaptiveScaffold.standardBottomNavigationBar(
191-
destinations: destinations),
219+
builder: (_) => AdaptiveScaffold.standardBottomNavigationBar(
220+
destinations: destinations,
221+
currentIndex: selectedNavigation,
222+
onDestinationSelected: (int newIndex) {
223+
setState(() {
224+
selectedNavigation = newIndex;
225+
});
226+
},
192227
),
193228
)
194229
},

‎packages/flutter_adaptive_scaffold/example/lib/adaptive_layout_demo.dart‎

Lines changed: 36 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -27,10 +27,17 @@ class MyApp extends StatelessWidget {
2727

2828
/// Creates a basic adaptive page with navigational elements and a body using
2929
/// [AdaptiveLayout].
30-
class MyHomePage extends StatelessWidget {
30+
class MyHomePage extends StatefulWidget {
3131
/// Creates a const [MyHomePage].
3232
const MyHomePage({super.key});
3333

34+
@override
35+
State<MyHomePage> createState() => _MyHomePageState();
36+
}
37+
38+
class _MyHomePageState extends State<MyHomePage> {
39+
int selectedNavigation = 0;
40+
3441
@override
3542
Widget build(BuildContext context) {
3643
// Define the children to display within the body.
@@ -113,19 +120,23 @@ class MyHomePage extends StatelessWidget {
113120
const List<NavigationDestination> destinations = <NavigationDestination>[
114121
NavigationDestination(
115122
label: 'Inbox',
116-
icon: Icon(Icons.inbox, color: Colors.black),
123+
icon: Icon(Icons.inbox_outlined),
124+
selectedIcon: Icon(Icons.inbox),
117125
),
118126
NavigationDestination(
119127
label: 'Articles',
120-
icon: Icon(Icons.article_outlined, color: Colors.black),
128+
icon: Icon(Icons.article_outlined),
129+
selectedIcon: Icon(Icons.article),
121130
),
122131
NavigationDestination(
123132
label: 'Chat',
124-
icon: Icon(Icons.chat_bubble_outline, color: Colors.black),
133+
icon: Icon(Icons.chat_outlined),
134+
selectedIcon: Icon(Icons.chat),
125135
),
126136
NavigationDestination(
127137
label: 'Video',
128-
icon: Icon(Icons.video_call_outlined, color: Colors.black),
138+
icon: Icon(Icons.video_call_outlined),
139+
selectedIcon: Icon(Icons.video_call),
129140
),
130141
];
131142

@@ -142,6 +153,12 @@ class MyHomePage extends StatelessWidget {
142153
inAnimation: AdaptiveScaffold.leftOutIn,
143154
key: const Key('Primary Navigation Medium'),
144155
builder: (_) => AdaptiveScaffold.standardNavigationRail(
156+
selectedIndex: selectedNavigation,
157+
onDestinationSelected: (int newIndex) {
158+
setState(() {
159+
selectedNavigation = newIndex;
160+
});
161+
},
145162
leading: const Icon(Icons.menu),
146163
destinations: destinations
147164
.map((_) => AdaptiveScaffold.toRailDestination(_))
@@ -152,6 +169,12 @@ class MyHomePage extends StatelessWidget {
152169
key: const Key('Primary Navigation Large'),
153170
inAnimation: AdaptiveScaffold.leftOutIn,
154171
builder: (_) => AdaptiveScaffold.standardNavigationRail(
172+
selectedIndex: selectedNavigation,
173+
onDestinationSelected: (int newIndex) {
174+
setState(() {
175+
selectedNavigation = newIndex;
176+
});
177+
},
155178
extended: true,
156179
leading: Row(
157180
mainAxisAlignment: MainAxisAlignment.spaceAround,
@@ -197,11 +220,14 @@ class MyHomePage extends StatelessWidget {
197220
key: const Key('Bottom Navigation Small'),
198221
inAnimation: AdaptiveScaffold.bottomToTop,
199222
outAnimation: AdaptiveScaffold.topToBottom,
200-
builder: (_) => BottomNavigationBarTheme(
201-
data: const BottomNavigationBarThemeData(
202-
selectedItemColor: Colors.black),
203-
child: AdaptiveScaffold.standardBottomNavigationBar(
204-
destinations: destinations),
223+
builder: (_) => AdaptiveScaffold.standardBottomNavigationBar(
224+
destinations: destinations,
225+
currentIndex: selectedNavigation,
226+
onDestinationSelected: (int newIndex) {
227+
setState(() {
228+
selectedNavigation = newIndex;
229+
});
230+
},
205231
),
206232
)
207233
},

‎packages/flutter_adaptive_scaffold/example/lib/adaptive_scaffold_demo.dart‎

Lines changed: 62 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,17 @@ class MyApp extends StatelessWidget {
2222

2323
/// Creates a basic adaptive page with navigational elements and a body using
2424
/// [AdaptiveScaffold].
25-
class MyHomePage extends StatelessWidget {
25+
class MyHomePage extends StatefulWidget {
2626
/// Creates a const [MyHomePage].
2727
const MyHomePage({super.key});
2828

29+
@override
30+
State<MyHomePage> createState() => _MyHomePageState();
31+
}
32+
33+
class _MyHomePageState extends State<MyHomePage> {
34+
int _selectedTab = 0;
35+
2936
// #docregion Example
3037
@override
3138
Widget build(BuildContext context) {
@@ -41,40 +48,60 @@ class MyHomePage extends StatelessWidget {
4148
)
4249
];
4350

44-
return BottomNavigationBarTheme(
45-
data: const BottomNavigationBarThemeData(
46-
unselectedItemColor: Colors.black,
47-
selectedItemColor: Colors.black,
48-
backgroundColor: Colors.white,
51+
return AdaptiveScaffold(
52+
// An option to override the default breakpoints used for small, medium,
53+
// and large.
54+
smallBreakpoint: const WidthPlatformBreakpoint(end: 700),
55+
mediumBreakpoint: const WidthPlatformBreakpoint(begin: 700, end: 1000),
56+
largeBreakpoint: const WidthPlatformBreakpoint(begin: 1000),
57+
useDrawer: false,
58+
selectedIndex: _selectedTab,
59+
onSelectedIndexChange: (int index) {
60+
setState(() {
61+
_selectedTab = index;
62+
});
63+
},
64+
destinations: const <NavigationDestination>[
65+
NavigationDestination(
66+
icon: Icon(Icons.inbox_outlined),
67+
selectedIcon: Icon(Icons.inbox),
68+
label: 'Inbox',
69+
),
70+
NavigationDestination(
71+
icon: Icon(Icons.article_outlined),
72+
selectedIcon: Icon(Icons.article),
73+
label: 'Articles',
74+
),
75+
NavigationDestination(
76+
icon: Icon(Icons.chat_outlined),
77+
selectedIcon: Icon(Icons.chat),
78+
label: 'Chat',
79+
),
80+
NavigationDestination(
81+
icon: Icon(Icons.video_call_outlined),
82+
selectedIcon: Icon(Icons.video_call),
83+
label: 'Video',
84+
),
85+
NavigationDestination(
86+
icon: Icon(Icons.home_outlined),
87+
selectedIcon: Icon(Icons.home),
88+
label: 'Inbox',
4989
),
50-
child: AdaptiveScaffold(
51-
// An option to override the default breakpoints used for small, medium,
52-
// and large.
53-
smallBreakpoint: const WidthPlatformBreakpoint(end: 700),
54-
mediumBreakpoint:
55-
const WidthPlatformBreakpoint(begin: 700, end: 1000),
56-
largeBreakpoint: const WidthPlatformBreakpoint(begin: 1000),
57-
useDrawer: false,
58-
destinations: const <NavigationDestination>[
59-
NavigationDestination(icon: Icon(Icons.inbox), label: 'Inbox'),
60-
NavigationDestination(
61-
icon: Icon(Icons.article), label: 'Articles'),
62-
NavigationDestination(icon: Icon(Icons.chat), label: 'Chat'),
63-
NavigationDestination(
64-
icon: Icon(Icons.video_call), label: 'Video')
65-
],
66-
body: (_) => GridView.count(crossAxisCount: 2, children: children),
67-
smallBody: (_) => ListView.builder(
68-
itemCount: children.length,
69-
itemBuilder: (_, int idx) => children[idx],
70-
),
71-
// Define a default secondaryBody.
72-
secondaryBody: (_) =>
73-
Container(color: const Color.fromARGB(255, 234, 158, 192)),
74-
// Override the default secondaryBody during the smallBreakpoint to be
75-
// empty. Must use AdaptiveScaffold.emptyBuilder to ensure it is properly
76-
// overridden.
77-
smallSecondaryBody: AdaptiveScaffold.emptyBuilder));
90+
],
91+
body: (_) => GridView.count(crossAxisCount: 2, children: children),
92+
smallBody: (_) => ListView.builder(
93+
itemCount: children.length,
94+
itemBuilder: (_, int idx) => children[idx],
95+
),
96+
// Define a default secondaryBody.
97+
secondaryBody: (_) => Container(
98+
color: const Color.fromARGB(255, 234, 158, 192),
99+
),
100+
// Override the default secondaryBody during the smallBreakpoint to be
101+
// empty. Must use AdaptiveScaffold.emptyBuilder to ensure it is properly
102+
// overridden.
103+
smallSecondaryBody: AdaptiveScaffold.emptyBuilder,
104+
);
78105
}
79-
// #enddocregion
106+
// #enddocregion
80107
}

0 commit comments

Comments
 (0)