[Flutter][3] Menambahkan Text dengan Text Widget

Hello, this is my website. Find all information about website design, website programming, HTML, CSS, Javascript, Jquery, Angular, Flutter, Plugin, Mockup, Mysql, Database, etc.

Tips & Trick



Card image cap
Tuesday, 19 Feb 2019

Hello world,

Hari ini pembahasannya adalah tentang widget Text pada flutter. Penggunaannya sangat sederhana. Selain dipakai pada title Text pasti paling banyak kita pakai selain icon dan image yang akan saya bahas di post selanjutnya. oke langsung saja kita mulai dengan kode hello world dari post sebelumnya seperti di bawah ini.

import 'package:flutter/material.dart';

void main(){
runApp(
new MaterialApp(
title: "My Apps",
home: new Myapp(),
)
);
}


class Myapp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: new Text("My Apps"),
),
body: new Container(
padding: EdgeInsets.all(20.0),
child: new Center(
child: new Text("Hello World"),
)
)
);
}
}

 Dalam kode di atas ada dua penggunaan Text yaitu  pada title dan pada body. Untuk Text pada body kita dapat tambahkan style sesuai yang kita inginkan menggunakan TextStyle seperti contohnya font size, font weight, dll.

new Text(
"Hello World",
style: TextStyle(color: Colors.red, fontSize: 20.0, fontWeight: FontWeight.bold),
),

- Font Color

Untuk font color kita bisa gunakan warna yang sudah disediakan flutter di sini.

- Font size

Untuk font size kita tinggal menyebukan angka saja sepeti contoh di atas.

- Font Weight

Font weight di sini hampir sama dengan yang ada di css website. ada pilihan bold (seperti contoh di atas), ada juga normal, lalu ada w100 sampai w900. 

Selamat mencoba :)