معرفی تابع Text
تابع Text یک تابع از کامپوز (Compose) است که باهاش میتونیم متن ها رو در اندروید نمایش بدیم؛ برای نمایش متن، باید متن رو به صورت String به پارامتر text تابع پاس بدیم.
Text(
text: String
)
استایل دهی متن در تابع Text
با استفاده از پارامتر های تابع Text میتونیم متن رو استایل دهی کنیم.
| <<Function>> | |
|---|---|
| androidx.compose.material3.Text | |
| Parameters | |
| modifier: Modifier | با استفاده از Modifier میتونیم برای تابع یک سری ویژگی های عمومی تعریف کنیم. |
| color: Color | رنگ متن رو تغییر میده. |
| fontSize: TextUnit | اندازه ی متن رو تغییر میده. |
| fontWeight: FontWeight | وزن متن رو تغییر میده (Bold, Medium, Normal و ...). |
| fontFamily: FontFamily | فونت مورد استفاده در متن رو تغییر میده. |
| fontStyle: FontStyle | استایل فونت رو تغییر میده (Italic, Normal). |
| letterSpacing: TextUnit | فاصله بین حروف متن رو تغییر میده. |
| lineHeight: TextUnit | ارتفاع هر خط در متن رو تغییر میده. |
| textDecoration: TextDecoration | دکوراسیون متن رو تغییر میده (Underline, Linethrough, None). |
| textAlign: TextAlign | محل قرار گیری متن در داخل کادر رو مشخص میکنه (Center, End, Start, ...). |
| maxLines: Int | مشخص میکنه متن حداکثر در چند خط نمایش داده بشه، مقدار پیشفرضش Int.MAX_VALUE است. |
| overflow: TextOverflow | نحوه نمایش متن، زمانی که طول متن از maxLines بیشتر شد (Clip, Ellipsis, Visible). |
در مثال زیر میخوایم یک متن رو با اندازه 100 sp با وزن Bold و فونت Monospace تعریف کنیم و رنگ متن رو آبی کنیم.
@Composable
fun MyHead(title: String){
Text(
text = title,
color = Color(0xFF0D47A1),
fontSize = 100.sp,
fontWeight = FontWeight.Bold,
fontFamily = FontFamily.Monospace
)
}
در بالا sp یک اکستنشن پراپرتی است که یک نمونه از TextUnit رو بر میگردونه.
در مثال زیر میخوایم یک متن نمایش بدیم که زیرش خط کشیده شده باشه و اندازه متن 18 sp باشه.
@Composable
fun MyDescription(description: String){
Text(
text = description,
textDecoration = TextDecoration.Underline,
fontSize = 18.sp
)
}
در زیر میخوایم متن های طولانی رو فقط در یک خط نمایش بدیم.
@Composable
fun MyOneLineText(text: String, modifier: Modifier = Modifier){
Text(
text = text,
overflow = TextOverflow.Ellipsis,
maxLines = 1,
modifier = modifier,
fontSize = 24.sp
)
}
میتونیم یک نمونه از TextStyle ایجاد کنیم و پارامتر های گفته شده رو بهش پاس بدیم و در نهایت خودشو به پارامتر style در تابع Text پاس بدیم.
@Composable
fun MyTitle(title: String, modifier: Modifier){
Text(
text = title,
modifier = modifier.background(Color(0xFFF5F5F5)).padding(16.dp),
style = TextStyle(
color = Color(0xFF0D47A1),
letterSpacing = 0.5.sp,
lineHeight = 80.sp,
fontSize = 70.sp,
textAlign = TextAlign.Center
)
)
}
میتونیم هر کدوم از مثال های گفته شده رو داخل تابع setContent که در قسمت قبل گفته شد صدا بزنیم.
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContent {
HelloWorldTheme {
Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
MyText(
"Hello World",
Modifier.padding(innerPadding)
)
}
}
}
}
}
@Composable
fun MyTitle(title: String, modifier: Modifier){
Text(
text = title,
modifier = modifier.background(Color(0xFFF5F5F5)).padding(16.dp),
style = TextStyle(
color = Color(0xFF0D47A1),
letterSpacing = 0.5.sp,
lineHeight = 80.sp,
fontSize = 70.sp,
textAlign = TextAlign.Center
)
)
}
خلاصه
- تابع Text یک تابع از کامپوز است که ازش برای نمایش متن استفاده میکنیم.
- پراپرتی sp یک پراپرتی اکستنشن است که یک نمونه از TextUnit رو برمیگردونه.
- برای تزیین متن در تابع Text پارمتر های مختلفی وجود داره که میتونیم ویژگی های ظاهری متن رو باهاشون تغییر بدیم.
- میتونیم ویژگی های ظاهری متن رو با کلاس TextStyle تعریف کنیم.
بازخورد و دیدگاه ها
اولین نفری باشید که در این صفحه نظر میدهید