Widget RichText digunakan untuk menampilkan teks dengan gaya yang berbeda-beda. Untuk mendefinisikan teks yang ditampilkan, digunakan sebuah pohon object TextSpan, dimana setiap sub-pohon memiliki gaya yang berbeda. Tergantung pada batasan tata letak, teks tersebut dapat dipecah menjadi beberapa baris atau tetap ditampilkan dalam satu baris yang sama. Hal ini bergantung pada kebutuhan penggunaan.
Constructor RichText
RichText(
{Key key,
@required InlineSpan text,
TextAlign textAlign: TextAlign.start,
TextDirection textDirection,
bool softWrap: true,
TextOverflow overflow:
TextOverflow.clip,
double textScaleFactor: 1.0,
int maxLines,
Locale locale,
StrutStyle strutStyle,
TextWidthBasis textWidthBasis: TextWidthBasis.parent,
TextHeightBehavior textHeightBehavior,})Properti RichText
- children: Widget-widget di bawah widget ini dalam struktur pohon.
- hashCode: Kode hash unik yang diberikan untuk object ini.
- key: Mengontrol bagaimana satu widget diganti oleh widget lain dalam struktur pohon.
- runtimeType: Representasi tipe object pada waktu runtime.
- text: Teks yang akan ditampilkan dalam widget ini.
- textAlign: Cara teks disusun secara horizontal di dalam widget.
- local: Properti ini mengambil object class Locale sebagai input. Ini mengontrol pengaturan font yang digunakan untuk teks berdasarkan bahasa yang dipilih.
- maxLines: Properti maxLines menentukan jumlah maksimum baris teks yang dapat ditampilkan dalam widget.
- overflow: TextOverflow adalah sebuah object enum yang mengatur perilaku teks dalam kasus overflow.
- softWrap: Properti ini mengambil nilai boolean sebagai input. Jika disetel ke false, maka teks tidak akan dibungkus ke dalam baris baru jika melebihi lebar widget.
- textDirection: Properti ini mengambil object class TextDirection sebagai input untuk menentukan arah teks yang ditampilkan.
- textHightBehaviour: TextHeightBehavior adalah object class yang mengatur perilaku tinggi teks dalam widget.
- textScaleFactor: Properti ini mengambil nilai double sebagai input untuk menentukan ukuran font relatif.
- textWidthBasis: TextWidthBasis enum adalah object yang mengatur lebar satu baris teks yang diukur dalam widget.
Contoh:
import 'package:flutter/material.dart';
// fungsi untuk mentrigger proses build aplikasi flutter
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// Widget ini adalah akar dari aplikasi Anda
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'ClipOval',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePAGE(),
debugShowCheckedModeBanner: false,
);
}
}
class MyHomePAGE extends StatefulWidget {
const MyHomePAGE({Key? key}) : super(key: key);
@override
State createState() => _MyHomePAGEState();
}
class _MyHomePAGEState extends State {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Nextgen Tutorial'),
backgroundColor: Colors.blue,
),
body: Center(
child: RichText(
// Mengontrol visual overflow
overflow: TextOverflow.clip,
// Mengontrol cara teks harus diselaraskan secara horizontal
textAlign: TextAlign.end,
// Mengontrol arah teks
textDirection: TextDirection.rtl,
// Apakah teks harus dipisahkan pada soft line breaks
softWrap: true,
// Jumlah maksimum baris yang harus dicakup oleh teks
maxLines: 1,
textScaleFactor: 1,
text: TextSpan(
text: 'Halo ',
style: DefaultTextStyle.of(context).style,
children: const [
TextSpan(
text: 'Guys', style: TextStyle(fontWeight: FontWeight.bold)),
],
),
)),
backgroundColor: Colors.lightBlue[50],
);
}
}
class MyClip extends CustomClipper {
@override
Rect getClip(Size size) {
return const Rect.fromLTWH(0, 0, 100, 100);
}
@override
bool shouldReclip(oldClipper) {
return false;
}
} Output:
Tutorial sebelumnya : Flutter AppBar
Tutorial setelahnya : Flutter Tab
Semua Tutorial Flutter : Tutorial Flutter