Row widget ni moja ya aina ya vitu vilivyowekwa kwenye msingi wa Flutter ambavyo hutoa njia ya kusimamia upangiliaji wa vitu kwa upande mmoja katika mwelekeo wa mstari mmoja. Kwa maneno mengine, Row widget inaruhusu kuweka watoto wake kwa njia ya usawa ndani ya safu moja.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Tehama'),
centerTitle: true,
backgroundColor: Colors.blue,
),
body: const Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'Text 1 ',
style: TextStyle(color: Colors.red), // Rangi ya kwanza
),
Text(
'Text 2 ',
style: TextStyle(color: Colors.green), // Rangi ya pili
),
Text(
'Text 3 ',
style: TextStyle(color: Colors.blue), // Rangi ya tatu
),
],
),
),
),
);
}
}
Property zake:
Hapa kuna baadhi ya muhimu zinazopatikana kwenye Row widget kwenye Flutter:
1.mainAxisAlignment: Inadhibiti jinsi watoto wa Row wanavyosimamishwa wima ndani yake. Baadhi ya chaguzi zinazopatikana ni MainAxisAlignment.start, MainAxisAlignment.center, MainAxisAlignment.end, MainAxisAlignment.spaceEvenly, MainAxisAlignment.spaceBetween, na MainAxisAlignment.spaceAround.
2.crossAxisAlignment: Inadhibiti jinsi watoto wa Row wanavyopangwa wima kwenye safu. Baadhi ya chaguzi zinazopatikana ni CrossAxisAlignment.start, CrossAxisAlignment.center, CrossAxisAlignment.end, CrossAxisAlignment.stretch, na CrossAxisAlignment.baseline.
3.mainAxisSize: Inadhibiti saizi ya msingi ya mstari wa watoto. Baadhi ya chaguzi zinazopatikana ni MainAxisSize.min na MainAxisSize.max.
4.textDirection: Inadhibiti mwelekeo wa maandishi kwa watoto wa safu. Chaguzi zinazopatikana ni TextDirection.ltr (kushoto kwenda kulia) na TextDirection.rtl (kulia kwenda kushoto).
5.verticalDirection: Inadhibiti mwelekeo wa wima wa watoto wa safu. Chaguzi zinazopatikana ni VerticalDirection.down (juu kwenda chini) na VerticalDirection.up (chini kwenda juu).
6.children: Ni orodha ya widgets ambazo zitawekwa kwenye safu yaani Row. Watoto wa safu ni vitu vinavyoonekana kwenye safu, kama vile Containas, Text, Icons, nk.
Kwa kutumia hizi, unaweza kudhibiti upangaji na muundo wa vitu ndani ya Row widget kulingana na mahitaji yako.
Unaweza kutumia property hizo kufanya mazoezi zaidi. Tumia mifano ya somo lililopita kuangalia jinsi unaweza kuzifanyia kai hizo property. Angalia hapo chini:-
child: Row (
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Text('Item 1'),
Text('Item 2'),
Text('Item 3'),
],
)
Mwisho:
Katika somo linalofuata tutakwenda kujifunza jinsi ya kutumia widget ya container. Hii ni widget muhimu ambayo kwa pamoja ukichanganya na hizo zilizotangulia unaweza kupata kitu bora.