स्पंदन ने दो वस्तुओं को चरम सीमा पर संरेखित किया - एक बाईं ओर और एक दाईं ओर

Question

मैं दो वस्तुओं को एक छोर पर और दूसरी तरफ दाईं ओर संरेखित करने का प्रयास कर रहा हूं। मेरे पास एक पंक्ति है जो बाईं ओर संरेखित है और फिर उस पंक्ति का एक बच्चा दाईं ओर संरेखित है। हालाँकि ऐसा लगता है कि चाइल्ड रो अपने माता-पिता से संरेखण संपत्ति उठा रहा है। यह मेरा कोड है

var SettingsRow = new Row(
            mainAxisAlignment: MainAxisAlignment.end,
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
                Text("Right",softWrap: true,),
            ],
        );

        var nameRow = new Row(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
                Text("Left"),
                SettingsRow,
            ],
        );

परिणामस्वरूप मुझे कुछ ऐसा मिलता है

Left Right

जो मैं चाहूंगा वह है

Left      Right

इसके अलावा रो पर पर्याप्त जगह है। मेरा सवाल यह है कि बच्चा रो अपनी MainAxisAlignment.endसंपत्ति का प्रदर्शन क्यों नहीं कर रहा है?

Answer 1

Rowइसके बजाय एकल का उपयोग करें mainAxisAlignment: MainAxisAlignment.spaceBetween।

new Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: [
    new Text("left"),
    new Text("right")
  ]
);

या आप उपयोग कर सकते हैं Expanded

new Row(
  children: [
    new Text("left"),
    new Expanded(
      child: settingsRow,
    ),
  ],
);

Comments

2 उदाहरण पर मैं उसका उपयोग करता हूं settingsRow, जिसमें शामिल हैText("right")

— रेमी रूसेलेट

समझा। उस भाग को याद किया

— गुंटर जोचबॉयर

धन्यवाद। लेकिन जिज्ञासा से बाहर क्यों मेरे कोड काम नहीं करता है? mainAxisAlignmentबच्चे की नहीं होती है। क्या माता-पिता के गुण बच्चों से आगे निकल जाते हैं?

— मिस्टीड

2 एक बहुत बेहतर है।

— रघु मुडेम

@ केप्रदीपकुमाररेड्डी या, फ्लेक्स के साथ अपनी पंक्ति में तीन विस्तारित विगेट्स रखें: 1. पहले में रिक्त (SizedBox) होगा, दूसरा - आपका केंद्रित विजेट (केंद्र में लिपटा हुआ) और तीसरा जिसमें आपका दायां-संरेखित विजेट होगा।

— एलेक्स सेमीनीक

Answer 2

एक सरल समाधान Spacer()दोनों विजेट के बीच उपयोग करना होगा

Row(
  children: [
    Text("left"),
    Spacer(),
    Text("right")
  ]
);

Comments

स्पेसर () क्या करता है? एक पंक्ति में, मैं एक विजेट को केंद्र में रखना चाहता हूं और दूसरा अत्यधिक दाईं ओर। क्या स्पेसर () का उपयोग करना संभव है?

— के प्रदीप कुमार रेड्डी

Answer 3

आप इसे कई तरीकों से कर सकते हैं।

का उपयोग करते हुए mainAxisAlignment: MainAxisAlignment.spaceBetween

Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: <Widget>[
    FlutterLogo(),
    FlutterLogo(),
  ],
);

---

का उपयोग करते हुए Spacer

Row(
  children: <Widget>[
    FlutterLogo(),
    Spacer(),
    FlutterLogo(),
  ],
);

---

का उपयोग करते हुए Expanded

Row(
  children: <Widget>[
    FlutterLogo(),
    Expanded(child: SizedBox()),
    FlutterLogo(),
  ],
);

---

का उपयोग करते हुए Flexible

Row(
  children: <Widget>[
    FlutterLogo(),
    Flexible(fit: FlexFit.tight, child: SizedBox()),
    FlutterLogo(),
  ],
);

---

आउटपुट :

Comments

मैं केंद्र में एक विजेट और अन्य चरम अधिकार चाहता हूं। हम इसे कैसे प्राप्त कर सकते हैं?

— के प्रदीप कुमार रेड्डी

@KPradeepKumarReddy Stackउस मामले में उपयोग करने के लिए एक अच्छा तरीका है ।

— कोप्सऑनरॉड

@KPradeepKumarReddy मुझे यकीन है कि एसओ पर पहले से ही इस तरह का कुछ सवाल होना चाहिए, आपको बस सही कीवर्ड के साथ खोज करने की आवश्यकता है। मैं वास्तव में आपको यहां टिप्पणी में कोड नहीं दिखा सकता, लेकिन विचार का उपयोग करना है Stack, इसके पहले बच्चे के साथ Align(दाएं) और दूसरा एक Centerया सरल हो सकता है Align।

— CopsOnRoad

Answer 4

हाँ CopsOnRoadसही है, स्टैक के माध्यम से आप एक को दाईं ओर और दूसरे को केंद्र में संरेखित कर सकते हैं।

Stack(
    children: [
      Align(
        alignment: Alignment.centerRight,
        child: Text("right"),
      ),
      Align(
        alignment: Alignment.center,
        child: Text("center"),
      )
    ],
  )