क्यों रो एक स्तंभ के अंदर क्षैतिज रूप से केंद्र नहीं है

Aug 17 2020

जैसा कि हम डिफ़ॉल्ट रूप से जानते हैं, कॉलम क्षैतिज रूप से अपने बच्चों को केंद्र में रखता है यदि इसकी पूरी चौड़ाई है। लेकिन जब मैंने दो कार्ड और एक पंक्ति को एक कॉलम के अंदर रखा, तो दो कार्डों को क्षैतिज रूप से केंद्र में रखा जाता है, लेकिन पंक्ति अपनी प्रारंभिक स्थिति में समान रहती है ? क्यों?
मुझे लगता है कि पंक्ति क्षैतिज रूप से केंद्र होनी चाहिए क्योंकि यह मेरे मामले में कॉलम का एक बच्चा है लेकिन ऐसा नहीं है।

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter App'),
      ),
      body: Container(
        color: Colors.purple,
        height: double.infinity,
        child: Column(
          //  mainAxisAlignment: MainAxisAlignment.center,
          //  crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Card(
              child: Text(
                'Chart',
                style: TextStyle(fontSize: 20.0),
              ),
              elevation: 5,
              color: Colors.blue,
            ),
            Card(
              child: Text(
                'list of tx',
                style: TextStyle(
                  fontSize: 20.0,
                ),
              ),
              color: Colors.purple,
            ),
            Row(
              children: [
                Text('this is row'),
              ],
            ),
          ],
        ),
      ),
    );
  }
}



इस कोड का उत्पादन

जवाब

1 Uni Aug 17 2020 at 16:14

यह इसलिए हो रहा है क्योंकि डिफ़ॉल्ट रूप से, रो पूरे क्षैतिज स्थान को ले जाएगा। आप इसे कम से कम जगह लेने के लिए कहकर इसे ठीक कर सकते हैं:

Row(
    mainAxisSize: MainAxisSize.min,
    ...
)

mainAxisAlignmentरो की सेटिंग MainAxisAlignment.centerकेवल तभी काम करेगी जब रो के अंदर एक विजेट होगा। यह केवल अपने बच्चों को केंद्र में जाने के लिए कहता है।

2 faroukosama Aug 17 2020 at 16:17

डिफ़ॉल्ट रूप से mainAxisSizeसंपत्ति है MainAxisSize.maxमें पंक्ति विजेट, आपको बस इतना करना है बस इसे बदल जाता है करने के लिए है क्या MainAxisSize.min, माता पिता विजेट द्वारा प्रभावित करने के लिए, इस उदाहरण में जो है कॉलम

Row(
    mainAxisSize: MainAxisSize.min,
    ...
)
1 Yash Aug 17 2020 at 16:08

mainAxisAlignmentअपने रो को तर्क देने की कोशिश करें । उदाहरण के लिए

Row(
    mainAxisAlignment: MainAxisAlignment.center,
    ...
)

इससे रो के बच्चे सेंट्रलाइज्ड होंगे।