textTheme
- Flutter kursu
- Orta seviye
- Ders 88/99
- 4 dk
TextTheme ile başlık ve gövde stillerini öğrenirsin.
TextTheme nedir?
TextTheme, uygulamadaki metin stillerini tek bir yerden tanımlamanı sağlar. bodyLarge büyük gövde metni, headlineLarge büyük başlık gibi alanlar içerir. ThemeData'nın textTheme parametresine bir TextTheme verirsen, tüm Text widget'ları varsayılan olarak bu stilleri kullanır.
ThemeData(
textTheme: const TextTheme(
bodyLarge: TextStyle(fontSize: 16),
),
)Bu yaklaşım, metin tutarlılığını kolayca sağlar.
bodyLarge ve headlineLarge
TextTheme içinde her metin rolü için bir alan vardır. bodyLarge büyük gövde metni için, headlineLarge ise büyük başlıklar içindir. Her alan bir TextStyle alır; burada yazı boyutu, kalınlık ve renk ayarlanır.
const TextTheme(
bodyLarge: TextStyle(fontSize: 16),
headlineLarge: TextStyle(fontSize: 32, fontWeight: FontWeight.bold),
)Bu stilleri Theme.of(context).textTheme üzerinden widget'lara uygularsın.
Uygulama TextTheme ile tema
Uygulama adında bir StatelessWidget tanımla. build metodu bir MaterialApp döndürsün. theme parametresine bir ThemeData ver; bu ThemeData'nın textTheme alanı bir TextTheme olsun ve içinde bodyLarge: TextStyle(fontSize: 16) bulunsun. home olarak Scaffold(body: Center(child: Text('Merhaba'))) kullan. main içinde 'hazir' yazdır.
Başlangıç kodu
import 'package:flutter/material.dart';
// Uygulama StatelessWidget tanımla
// build MaterialApp döndürsün
// theme içinde textTheme kullan
void main() {
// 'hazir' yazdır
}Örnek çözüm
import 'package:flutter/material.dart';
class Uygulama extends StatelessWidget {
const Uygulama({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(
textTheme: const TextTheme(
bodyLarge: TextStyle(fontSize: 16),
),
),
home: const Scaffold(body: Center(child: Text('Merhaba'))),
);
}
}
void main() {
print('hazir');
}Beklenen çıktı
hazir
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 TextTheme hangi türden verileri içerir?
- Metin stilleri Doğru cevap
- Buton stilleri
- Navigasyon yolları
- Veritabanı tabloları
Açıklama: TextTheme TextStyle nesnelerini içerir; bodyLarge, headlineLarge gibi alanlar metin stillerini tutar. Navigasyon, buton stilleri ve veritabanı TextTheme ile ilgili değildir.
2 TextTheme alanı
const TextTheme(
____: TextStyle(fontSize: 16),
),const TextTheme(
bodyLarge: TextStyle(fontSize: 16),
),Açıklama: Material 3 TextTheme'inde büyük gövde stili bodyLarge alanıyla belirtilir. bodyText1 eski Material 2 adıdır, textLarge ve bodyStyle TextTheme alanları değildir.
3 TextTheme parçaları
| Kavram | Anlamı |
|---|---|
TextTheme |
metin stilleri kümesi |
bodyLarge |
büyük gövde stili |
headlineLarge |
büyük başlık stili |
TextStyle |
tek metin stili |