Skip to content

Commit 0a217a1

Browse files
sazardevsazardev
committed
Refactor widget imports and enhance UI components
- Updated import for category card widget in components screen. - Added favorite icon button and code view button in Cupertino and Dialogs & Overlays screens. - Refactored SearchScreen to use StatefulWidget, added advanced search features including category filtering, favorites toggle, and sorting options. - Removed unused imports and variables in SecurityAuthScreen. - Enhanced SliversScreen with code view buttons for SliverAppBar, SliverGrid, SliverList, and NestedScrollView components.
1 parent 8506a6b commit 0a217a1

File tree

38 files changed

+11387
-562
lines changed

38 files changed

+11387
-562
lines changed

‎lib/components/accessibility/constants/accessibility_codes.dart‎

Lines changed: 329 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,329 @@
1+
Map<String, String> accessibilitySourceCodes = {
2+
// Semantics codes
3+
'Semantics-Basic': '''
4+
Semantics(
5+
label: 'Increment Counter',
6+
hint: 'Tap to increase the counter value',
7+
child: FloatingActionButton(
8+
onPressed: () {
9+
// Increment counter
10+
},
11+
child: Icon(Icons.add),
12+
),
13+
)''',
14+
15+
'Semantics-Complex': '''
16+
Semantics(
17+
container: true,
18+
label: 'User Profile Card',
19+
child: Card(
20+
child: Column(
21+
children: [
22+
Semantics(
23+
label: 'Profile picture of John Doe',
24+
child: CircleAvatar(
25+
backgroundImage: AssetImage('assets/profile.jpg'),
26+
),
27+
),
28+
Semantics(
29+
label: 'User name',
30+
child: Text('John Doe'),
31+
),
32+
Semantics(
33+
label: 'Email address',
34+
child: Text('[email protected]'),
35+
),
36+
],
37+
),
38+
),
39+
)''',
40+
41+
// ExcludeSemantics codes
42+
'ExcludeSemantics-Basic': '''
43+
Column(
44+
children: [
45+
Text('This text is accessible'),
46+
ExcludeSemantics(
47+
child: Container(
48+
width: 50,
49+
height: 50,
50+
color: Colors.blue,
51+
child: Text('Hidden from screen readers'),
52+
),
53+
),
54+
Text('This text is also accessible'),
55+
],
56+
)''',
57+
58+
// MergeSemantics codes
59+
'MergeSemantics-Basic': '''
60+
MergeSemantics(
61+
child: Row(
62+
children: [
63+
Icon(Icons.star),
64+
Text('5'),
65+
Text('stars'),
66+
],
67+
),
68+
)
69+
// Screen reader will announce: "5 stars"''',
70+
71+
// Focus Management codes
72+
'Focus-Management': '''
73+
class FocusExample extends StatefulWidget {
74+
@override
75+
_FocusExampleState createState() => _FocusExampleState();
76+
}
77+
78+
class _FocusExampleState extends State<FocusExample> {
79+
late FocusNode _firstFocusNode;
80+
late FocusNode _secondFocusNode;
81+
82+
@override
83+
void initState() {
84+
super.initState();
85+
_firstFocusNode = FocusNode();
86+
_secondFocusNode = FocusNode();
87+
}
88+
89+
@override
90+
void dispose() {
91+
_firstFocusNode.dispose();
92+
_secondFocusNode.dispose();
93+
super.dispose();
94+
}
95+
96+
@override
97+
Widget build(BuildContext context) {
98+
return Column(
99+
children: [
100+
TextField(
101+
focusNode: _firstFocusNode,
102+
decoration: InputDecoration(labelText: 'First Field'),
103+
),
104+
TextField(
105+
focusNode: _secondFocusNode,
106+
decoration: InputDecoration(labelText: 'Second Field'),
107+
),
108+
ElevatedButton(
109+
onPressed: () {
110+
_secondFocusNode.requestFocus();
111+
},
112+
child: Text('Focus Second Field'),
113+
),
114+
],
115+
);
116+
}
117+
}''',
118+
119+
// Screen Reader codes
120+
'Screen-Reader-Announcements': '''
121+
ElevatedButton(
122+
onPressed: () {
123+
// Announce to screen readers
124+
SemanticsService.announce(
125+
'Action completed successfully',
126+
TextDirection.ltr,
127+
);
128+
},
129+
child: Text('Complete Action'),
130+
)''',
131+
132+
// Live Region codes
133+
'Live-Region': '''
134+
class LiveRegionExample extends StatefulWidget {
135+
@override
136+
_LiveRegionExampleState createState() => _LiveRegionExampleState();
137+
}
138+
139+
class _LiveRegionExampleState extends State<LiveRegionExample> {
140+
String _statusMessage = 'Ready';
141+
142+
void _updateStatus(String message) {
143+
setState(() {
144+
_statusMessage = message;
145+
});
146+
147+
// Announce the change to screen readers
148+
SemanticsService.announce(
149+
message,
150+
TextDirection.ltr,
151+
);
152+
}
153+
154+
@override
155+
Widget build(BuildContext context) {
156+
return Column(
157+
children: [
158+
Semantics(
159+
liveRegion: true,
160+
child: Text(
161+
'Status: \$_statusMessage',
162+
style: TextStyle(fontSize: 18),
163+
),
164+
),
165+
ElevatedButton(
166+
onPressed: () => _updateStatus('Loading...'),
167+
child: Text('Start Loading'),
168+
),
169+
ElevatedButton(
170+
onPressed: () => _updateStatus('Complete'),
171+
child: Text('Complete'),
172+
),
173+
],
174+
);
175+
}
176+
}''',
177+
178+
// Keyboard Navigation codes
179+
'Keyboard-Navigation': '''
180+
class KeyboardNavigationExample extends StatelessWidget {
181+
@override
182+
Widget build(BuildContext context) {
183+
return Focus(
184+
child: Builder(
185+
builder: (context) {
186+
return GestureDetector(
187+
onTap: () {
188+
Focus.of(context).requestFocus();
189+
},
190+
child: Container(
191+
padding: EdgeInsets.all(16),
192+
decoration: BoxDecoration(
193+
border: Border.all(
194+
color: Focus.of(context).hasFocus
195+
? Colors.blue
196+
: Colors.grey,
197+
width: 2,
198+
),
199+
),
200+
child: Text('Focusable Container'),
201+
),
202+
);
203+
},
204+
),
205+
);
206+
}
207+
}''',
208+
209+
// Color Contrast codes
210+
'Color-Contrast': '''
211+
// Good contrast example
212+
Container(
213+
color: Colors.blue[900], // Dark background
214+
padding: EdgeInsets.all(16),
215+
child: Text(
216+
'High contrast text',
217+
style: TextStyle(
218+
color: Colors.white, // Light text
219+
fontSize: 18,
220+
),
221+
),
222+
)
223+
224+
// Color-blind friendly example
225+
Row(
226+
children: [
227+
Container(
228+
width: 50,
229+
height: 50,
230+
decoration: BoxDecoration(
231+
color: Colors.blue,
232+
border: Border.all(color: Colors.black, width: 2),
233+
),
234+
child: Center(child: Text('1')),
235+
),
236+
Container(
237+
width: 50,
238+
height: 50,
239+
decoration: BoxDecoration(
240+
color: Colors.orange,
241+
border: Border.all(color: Colors.black, width: 2),
242+
),
243+
child: Center(child: Text('2')),
244+
),
245+
],
246+
)''',
247+
248+
// Tooltip Accessibility codes
249+
'Tooltip-Accessibility': '''
250+
Tooltip(
251+
message: 'This button adds a new item to your list',
252+
child: Semantics(
253+
label: 'Add item button',
254+
hint: 'Double tap to add a new item',
255+
child: IconButton(
256+
icon: Icon(Icons.add),
257+
onPressed: () {
258+
// Add item logic
259+
},
260+
),
261+
),
262+
)''',
263+
264+
// Text Scaling codes
265+
'Text-Scaling': '''
266+
Widget build(BuildContext context) {
267+
final textScaleFactor = MediaQuery.of(context).textScaleFactor;
268+
269+
return Column(
270+
children: [
271+
Text('Current text scale: \${textScaleFactor.toStringAsFixed(1)}x'),
272+
Text(
273+
'This text scales with system settings',
274+
style: TextStyle(fontSize: 16),
275+
),
276+
// Text that respects user's text scaling preferences
277+
Text(
278+
'Accessible text that scales properly',
279+
style: Theme.of(context).textTheme.bodyLarge,
280+
),
281+
],
282+
);
283+
}''',
284+
285+
// Button Accessibility codes
286+
'Button-Accessibility': '''
287+
// Accessible button with proper semantics
288+
Semantics(
289+
button: true,
290+
label: 'Save document',
291+
hint: 'Saves the current document to your device',
292+
enabled: true,
293+
child: ElevatedButton(
294+
onPressed: () {
295+
// Save logic
296+
},
297+
child: Row(
298+
mainAxisSize: MainAxisSize.min,
299+
children: [
300+
Icon(Icons.save),
301+
SizedBox(width: 8),
302+
Text('Save'),
303+
],
304+
),
305+
),
306+
)''',
307+
308+
// Image Accessibility codes
309+
'Image-Accessibility': '''
310+
// Image with proper alt text
311+
Semantics(
312+
label: 'A golden retriever dog playing fetch in a park',
313+
child: Image.asset(
314+
'assets/dog.jpg',
315+
width: 200,
316+
height: 150,
317+
fit: BoxFit.cover,
318+
),
319+
)
320+
321+
// Decorative image (hidden from screen readers)
322+
ExcludeSemantics(
323+
child: Image.asset(
324+
'assets/decorative_pattern.png',
325+
width: 100,
326+
height: 100,
327+
),
328+
)''',
329+
};

0 commit comments

Comments
 (0)