সমঝোতার মধ্যে মোড়ানো_পরিচয় এবং ম্যাচ_পিতা সমতুল্য?


127

অ্যান্ড্রয়েডে match_parentএবং wrap_contentউইজেটে থাকা সামগ্রীর সাথে উইন্ডোজ স্বয়ংক্রিয়ভাবে তাদের পিতামাতার তুলনায় পুনরায় আকার দিতে ব্যবহৃত হয়।

বিড়বিড় করে এটি ডিফল্টভাবে মনে হয় সমস্ত উইজেট সেট করা আছে wrap_content, আমি কীভাবে এটিকে এমনভাবে পরিবর্তন করব যে আমি এটির widthএবং heightতার পিতামাতার সাথে পূরণ করতে পারি ?

উত্তর:


161

আপনি সামান্য ট্রিক দিয়ে করতে পারেন: মনে করুন আপনার প্রয়োজনীয়তা রয়েছে: (প্রস্থ, উচ্চতা)

মোড়ানো_ কনটেন্ট, মোড়ানো_ কনটেন্ট:

 //use this as child
 Wrap(
  children: <Widget>[*your_child*])

Match_parent, Match_parent:

 //use this as child
Container(
        height: double.infinity,
    width: double.infinity,child:*your_child*)

ম্যাচ প্যারেন্ট, মোড়ানো_পরিচয়:

 //use this as child
Row(
  mainAxisSize: MainAxisSize.max,
  children: <Widget>[*your_child*],
);

মোড়ানো_পরিচয়, ম্যাচ_পিতা:

 //use this as child
Column(
  mainAxisSize: MainAxisSize.max,
  children: <Widget>[your_child],
);

2
পিতামাতার সাথে ম্যাচটি করতে আপনি নিজের উইজেটগুলি সাইজডবক্স.এক্সপ্যান্ড ()
ওয়েচারোস্কি

138

আদেশের জন্য আচরণ পাওয়ার জন্য match_parent এবং wrap_content আমরা ব্যবহার করতে হবে mainAxisSize সম্পত্তি সারি / কলাম উইজেট, mainAxisSize সম্পত্তি লাগে MainAxisSize দুটি মানের যা থাকার enum MainAxisSize.min যা আচরণ করবে wrap_content এবং MainAxisSize.max যা আচরণ করবে match_parent

এখানে চিত্র বর্ণনা লিখুন

মূল নিবন্ধের লিঙ্ক


6
আমি যুক্ত করব যে crossAxisAlignmentসারি এবং কলামগুলিতে এমন ক্ষেত্রও রয়েছে যা CrossAxisAlignment.stretchএকটি কলামের মধ্যে অনুভূমিকভাবে প্রসারিত করতে সেট করা যেতে পারে
wamfous

1
অনেক ধন্যবাদ! আমি গত বছর ভোট দিয়েছি, তারপরে আমি খুব বেশি সময় ধরে ফালতু ব্যবহার করিনি এবং প্রায় সব কিছু ভুলে গেছি এবং আপনি আজ আমাকে আবার সাহায্য করেছেন।
চ্যান্ডলার

33

সংক্ষিপ্ত উত্তরটি হ'ল সন্তানের আকার না হওয়া পর্যন্ত পিতামাতার একটি আকার থাকে না।

ঝাঁকুনিতে লেআউটটি যেভাবে কাজ করে তা হ'ল প্রতিটি উইজেট তার প্রতিটি বাচ্চার প্রতিবন্ধকতা সরবরাহ করে, যেমন "আপনি এই প্রশস্ত হতে পারেন, আপনাকে অবশ্যই এই লম্বা হতে হবে, আপনাকে কমপক্ষে এই প্রশস্ত হতে হবে", বা যা কিছু (বিশেষত, তারা সর্বনিম্ন প্রস্থ, সর্বাধিক প্রস্থ, সর্বনিম্ন উচ্চতা এবং সর্বাধিক উচ্চতা পান)। প্রতিটি শিশু এই প্রতিবন্ধকতাগুলি গ্রহণ করে, কিছু করে এবং একটি বাছাই করে (প্রস্থ এবং উচ্চতা) যা এই সীমাবদ্ধতার সাথে মেলে। তারপরে, প্রতিটি শিশু একবার তার কাজটি সম্পন্ন করলে, উইজেটটি তার নিজের আকারটি চয়ন করতে পারে।

কিছু উইজেট পিতামাতার অনুমতি অনুসারে বড় হওয়ার চেষ্টা করে। কিছু উইজেট পিতামাতার অনুমতি অনুসারে ছোট হওয়ার চেষ্টা করে। কিছু উইজেট একটি নির্দিষ্ট "প্রাকৃতিক" আকারের (যেমন পাঠ্য, চিত্র) মেলাতে চেষ্টা করে।

কিছু উইজেট তাদের বাচ্চাদের বলে যে তারা যে কোনও আকার হতে পারে। কেউ কেউ তাদের সন্তানদের তাদের পিতামাতার কাছ থেকে পেয়েছিলেন একই বাধা দেয়।


ইয়ান যখন আমি একটি আছে PageViewএকটি ভিতরে Columnঅপরের সাথে, Columnবর্তমান ভিতরে page, আমি একটি রেন্ডারিং ভুল পান, কিন্তু আমি মোড়কে এটা ঠিক করতে পারবো PageViewএকটি ভিতরে Expandedবা Flexible। সমস্যাটি হল, এই 2 টি বিকল্প কেবল তাদের সন্তানের প্রসারিত করবে। এই জাতীয় রেন্ডারিংয়ের সমস্যা সমাধানের জন্য "মোড়কের সামগ্রী" এর মতো উপযুক্ত উইজেট কেন সঙ্কুচিত হতে পারে না?
মিশেল ফিনস্টেইন

21

আসলে কিছু বিকল্প উপলব্ধ রয়েছে:

আপনি কেবলমাত্র দৈর্ঘ্যের সাথে মেলে আপনার প্রস্থ বা সাইজডবক্সের (দৈর্ঘ্য: ডাবল.ইনফিনিটি) সাথে মেলে তুলতে আপনার উইজেটের সাথে পিতামাতার আকারগুলি তৈরি করতে সাইজডবক্স.এক্সপ্যান্ড বা সাইজডবক্স (প্রস্থ: ডাবল.ইনফিনিটি) ব্যবহার করতে পারেন।

যদি আপনি একটি মোড়ানো_ কনটেন্ট আচরণ চান তবে এটি নির্ভর করে আপনি যে প্যারেন্ট উইজেট ব্যবহার করছেন তার উপর নির্ভর করে, উদাহরণস্বরূপ আপনি যদি একটি কলামে একটি বোতাম রাখেন তবে এটি মোড়ানো_প্যান্টের মতো আচরণ করবে এবং এটি ম্যাচ-প্যারেন্টের মতো ব্যবহার করতে আপনি বোতামটি প্রসারিত উইজেট বা সাইজবক্সের সাথে মোড়াতে পারবেন।

লিস্টভিউয়ের সাহায্যে বোতামটি মিলবে_ পিতামহুল আচরণ এবং একটি মোড়ানো_সামগ্রী আচরণ পেতে আপনি এটি সারি এর মতো একটি ফ্লেক্স উইজেট দিয়ে মোড়াতে পারবেন।

একটি প্রসারিত উইজেট ব্যবহার করে একটি অক্ষ, কলাম বা ফ্লেক্সের একটি শিশুকে মূল অক্ষে উপলব্ধ স্থান পূরণ করার জন্য প্রসারিত করা হয় (উদাহরণস্বরূপ, একটি সারি জন্য অনুভূমিকভাবে বা একটি কলামের জন্য উল্লম্বভাবে)। https://docs.flutter.io/flutter/widgets/Expanded-class.html

নমনীয় উইজেট ব্যবহার করে একটি সারি, কলাম বা ফ্লেক্সের একটি শিশুকে মূল অক্ষের মধ্যে উপলব্ধ স্থান পূরণ করার জন্য প্রসারিত করার নমনীয়তা দেয় (উদাহরণস্বরূপ, একটি সারি জন্য অনুভূমিকভাবে বা একটি কলামের জন্য উল্লম্বভাবে), তবে বিস্তৃত বিপরীতে, নমনীয় হয় না সন্তানের উপলব্ধ স্থান পূরণ করার প্রয়োজন। https://docs.flutter.io/flutter/widgets/Flexible-class.html


7

একটি সাধারণ কাজ:

যদি কোনও ধারকটির কেবলমাত্র একটি শীর্ষ স্তরের শিশু থাকে তবে আপনি সন্তানের জন্য প্রান্তিককরণ সম্পত্তি নির্দিষ্ট করতে এবং কোনও উপলভ্য মান দিতে পারেন। এটি পাত্রে সমস্ত স্থান পূরণ করবে।

Container(color:Colors.white,height:200.0,width:200.0,
 child:Container(
    color: Colors.yellow,
    alignment:Alignment.[any_available_option] // make the yellow child match the parent size
   )
)

অন্য উপায়:

Container(color:Colors.white,height:200.0,width:200.0,
 child:Container(
    color: Colors.yellow,
    constraints:  BoxConstraints.expand(height: 100.0), // height will be 100 dip and width will be match parent
   )
)

BoxConstraints.expand(height: 100.0)অ্যান্ড্রয়েডের width="match_parent"সমতুল্য হিসাবে দুর্দান্ত কাজ করে
কোসিয়ারা - বার্তোসক কোসারজিকি

6

আমি এই সমাধানটি ব্যবহার করেছি, আপনাকে মিডিয়াকিউয়ারি ব্যবহার করে আপনার পর্দার উচ্চতা এবং প্রস্থ নির্ধারণ করতে হবে:

 Container(
        height: MediaQuery.of(context).size.height,
        width: MediaQuery.of(context).size.width
  )

5
Stack(
  children: [
    Container(color:Colors.red, height:200.0, width:200.0),
    Positioned.fill(
      child: Container(color: Colors. yellow),
    )
  ]
),

1
যদিও আপনার কোডটি প্রশ্নের উত্তর দিতে পারে, একটি উত্তরের উত্তরে কোডটি কী করে এবং কীভাবে এটি সমস্যার সমাধান করে তা সবসময় ব্যাখ্যা করা উচিত।
বিডিএল

এটি মোড়ানো সামগ্রীর জবাব নয়। এটি কেবল শক্ত কোডড প্রস্থ এবং উচ্চতা।
বিকাশ করুন

1

উইজেট ব্যবহার করুন Wrap

জন্য Columnমত আচরণ করার চেষ্টা করুন:

  return Wrap(
          direction: Axis.vertical,
          spacing: 10,
          children: <Widget>[...],);

জন্য Rowমত আচরণ করার চেষ্টা করুন:

  return Wrap(
          direction: Axis.horizontal,
          spacing: 10,
          children: <Widget>[...],);

আরও তথ্যের জন্য: মোড়ানো (বিড়বিড় করে উইজেট)


0

কলামের অভ্যন্তরে কোডগুলির এই লাইনটি ব্যবহার করুন। Wrap_content জন্য: mainAxisSize: MainAxisSize.min match_parent জন্য:mainAxisSize: MainAxisSize.max


0

এটি করার জন্য খুব সহজ এবং ঝরঝরে উপায় আছে।

FractionallySizedBoxউইজেট ব্যবহার করুন ।

FractionallySizedBox(
  widthFactor: 1.0, // width w.r.t to parent
  heightFactor: 1.0,  // height w.r.t to parent
  child: *Your Child Here*
}

আপনি যখন বাচ্চাকে তার পিতামাতার আকারের ভগ্নাংশে আকার দিতে চান তখন এই উইজেটটিও খুব কার্যকর।

উদাহরণ:

যদি আপনি চান বাচ্চা তার পিতামাতার 50% প্রস্থ দখল করতে পারে তবে widthFactorহিসাবে সরবরাহ করুন0.5


0

কোনও শিশুকে তার পিতামাতাকে পূর্ণ করতে, কেবল এটি ফিটডবক্সে মুড়িয়ে দিন

    FittedBox(
     child: Image.asset('foo.png'),
     fit: BoxFit.fill,
   )
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.