معرفی ویدجت Text در Flutter
برنامه نویسی
دوشنبه 11 آذر 1398
پارسا رضایی مرام

معرفی ویدجت Text در Flutter


اگر با Flutter آشنا باشید ، این موضوع را به خوبی می دانید که فلاتر برای طراحی ظاهر اپلیکیشن از Widget ها استفاده می کند . Widget ها در واقع ابزارک هایی هستند که به ما کمک می کنند که سریع تر به رابط کاربری مورد نظر خودمان برسیم . 

همچنین می توانید برای یادگیری Flutter ، از دوره آموزش Flutter استفاده کنید .

در این مقاله قصد داریم که ویدجت پایه ای و پر کاربرد Text را به شما دوستان معرفی کنیم و برخی از ویژگی های این ویدجت را مورد بررسی قرار دهیم .

همانطور که از عنوان ویدجت پیداست ، این ویدجت برای استفاده از متن به کار می رود و شما می توانید با استفاده از این ویدجت ، متن های خود را مدیریت کنید .

روش استفاده از این ویدجت به این گونه هست که کافیست هرجایی که نیاز به متن داشتید این کلاس را فراخوانی کنید .

Text()

این ویدجت ویژگی های زیادی را دارد که میخواهیم برخی از این ویژگی ها را با هم دیگر بررسی کنیم.

ویژگی textAlign به ما کمک می کند که نحوه قرار گیری متن خود را مشخص کنیم . مثلا متن ما راست چین باشد یا چپ چین ، وسط چین باشد یا به شکل justify :

text-align-flutter

 

در دو تصویر زیر می توانید حالت های Center و Justify شده ی یک متن را مشاهده کنید :

 

text-align-center-fluttertext-align-justify-flutter

 

مورد بعدی که وجود دارد ، maxLines و overflow هستند . maxLines که مشخص هست یعنی متن ما را در تعدادی خط محدود می کند و overflow هم اگر فضای کافی نداشته باشیم متن را در انتهای متن به شکل سه نقطه ، بریده شده و یا fade نشان می دهد . 

 

maxline-overflow

 

همچنین در تصویر می توانید نتیجه متن را در ۲ خط ببینید :

 

maxlines-flutter

و اما مهم ترین بخش ویدجت Text بخش Style آن است که می توانید مواردی چون : سایز متن ، رنگ متن ، بک گراند ، فونت و ... مشخص کنید .

fontSize : با استفاده از این ویژگی می توانید سایز فونت متن خود را مشخص کنید .

color : می توانید رنگ متن خود را مشخص کنید .

decoration : با استفاده از این ویژگی می توانید با استفاده از کلاس TextDecoration به متن خود یک زیر خط (underline) ، روی خط (overline) و یا به شکل خط خطی (lineThrough) اضافه کنید.

decorationStyle : این ویژگی وابسته به decoration هست و شما می توانید به خط خود style بدید.

backgroundColor : با استفاده از این ویژگی هم می توانید به زمینه ، متن رنگی را اضافه کنید.

fontWeight : می توانید با این ویژگی متن خود را Bold کنید .

letterSpacing : فاصله های بین کاراکتر ها را می توانید مشخص کنید .

wordSpacing : فاصله های بین کلمات را می توانید مشخص کنید .

height : فاصله ی بین خط ها را می توانید کنترل کنید .

fontFamily : نوع فونت استفاده شده برای متن را می توانید مشخص کنید .

text-style

 

در تصویر زیر نتیجه کد های بالا را مشاهده می کنید :

 

flutter-style

در ادامه باید این نکته را بگویم که همین ویدجت Text به ظاهر ساده ، ویژگی های دیگری هم دارد که ما مهمترین های آن ها را بررسی کردیم .

این مطلب به شکل اختصاصی توسط وب سایت سه گوش تهیه و تولید شده است که امیدواریم مفید واقع شده باشد .

دیدگاه ها
برای ثبت دیدگاه یا درج پاسخ باید عضو باشید

دیدگاهی تا کنون ثبت نشده است