ကြွပ်ကြွပ်အိတ်- float right react ဇာတိ

React Native ကိုအသုံးပြုရာတွင် အဓိကပြဿနာမှာ ပြဿနာများကို အမှားရှာရန်နှင့် ပြဿနာဖြေရှင်းရန် ခက်ခဲနိုင်သည်။ React Native သည် ပလပ်ဖောင်း-မျက်ကွယ်ပြုနိုင်သော ဖွံ့ဖြိုးတိုးတက်မှုဘောင်တစ်ခုဖြစ်သောကြောင့်၊ developer များသည် ၎င်းတို့လုပ်ဆောင်နေသော မတူညီသော platform တစ်ခုစီအတွက် မတူညီသော အမှားရှာပြင်ခြင်းနှင့် ပြဿနာဖြေရှင်းခြင်းနည်းပညာများကို လေ့လာရပါမည်။ ထို့အပြင်၊ React Native အက်ပ်များကို မူလအက်ပ်များကဲ့သို့ ကောင်းစွာ မပံ့ပိုးနိုင်သောကြောင့် အမှားရှာပြင်ခြင်း သို့မဟုတ် ပြဿနာများကို ဖြေရှင်းရန် အရင်းအမြစ်များ အနည်းငယ်သာ ရှိနိုင်ပါသည်။

<View style={{flexDirection: 'row', justifyContent: 'space-between'}}>
  <Text>Left</Text>
  <Text>Right</Text>
</View>

ပထမစာကြောင်းသည် စတိုင်ရည်ညွှန်းချက်ဖြင့် View element တစ်ခုကို ဖန်တီးသည်။ စတိုင်ရည်ညွှန်းချက်တွင် ဂုဏ်သတ္တိနှစ်ခု၊ flexDirection နှင့် justifyContent ပါရှိသော အရာတစ်ခုပါရှိသည်။ flexDirection ၏တန်ဖိုးမှာ 'row' ဖြစ်ပြီး justifyContent ၏တန်ဖိုးမှာ 'space-between' ဖြစ်သည်။

View element အတွင်းတွင် Text element နှစ်ခုရှိသည်။ ပထမစာသားဒြပ်စင်တွင် စာသား 'လက်ဝဲ' ရှိပြီး ဒုတိယ စာသားဒြပ်စင်တွင် စာသား 'ညာဘက်' ရှိသည်။

Float လုပ်နည်း

React Native တွင် float အလုပ်လုပ်ရန် အကောင်းဆုံးနည်းလမ်းမှာ သင်တည်ဆောက်နေသည့် အက်ပ်ပေါ်မူတည်၍ ကွဲပြားမည်ဖြစ်သောကြောင့် ဤမေးခွန်းအတွက် အရွယ်အစား-ကိုက်ညီ-အားလုံးအတွက် အဖြေမရှိပါ။ သို့သော်လည်း၊ React Native တွင် float အလုပ်လုပ်ပုံအတွက် အကြံပြုချက်အချို့တွင် fluid grid layout ကိုအသုံးပြုကာ CSS positioning properties ကိုအသုံးပြု၍ element အားလုံးကို နေရာချထားကြောင်းသေချာစေပါသည်။ ထို့အပြင်၊ အိုင်ကွန်များအတွက် react-native-vector-icons နှင့် animations အတွက် react-native-ripple ကိုအသုံးပြုရန် အထောက်အကူဖြစ်နိုင်သည်။

float ဝဲ

React Native တွင် ၎င်းကိုလုပ်ဆောင်ရန် built-in နည်းလမ်းမရှိပါ။ react-native-float-left ကဲ့သို့သော စာကြည့်တိုက်ကို သင်သုံးနိုင်သည် သို့မဟုတ် inline လုပ်ဆောင်ချက်ကို အသုံးပြုနိုင်သည်။

Related ရေးသားချက်များ:

a Comment ချန်ထား