colorScheme
- Flutter kursu
- Orta seviye
- Ders 87/99
- 4 dk
ColorScheme ile renk paleti kurmayı öğrenirsin.
ColorScheme nedir?
ColorScheme, bir uygulamanın renk paletini tanımlayan nesnedir. primary ana rengi, surface ise kart ve arka plan gibi yüzeylerin rengini belirler. ColorScheme.fromSeed(seedColor: ...) ile tek bir tohum renkten tüm paleti otomatik üretirsin.
ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.teal),
)Bu yöntem, Material 3 uyumlu dengeli bir palet oluşturur.
primary ve surface renkleri
primary renk, butonlar ve AppBar gibi vurgulu öğelerde kullanılır. surface ise kartlar, diyaloglar ve arka planlar gibi yüzeylerde kullanılır. ColorScheme.fromSeed bu renkleri tohumdan otomatik hesaplar.
final cs = ColorScheme.fromSeed(seedColor: Colors.orange);
print(cs.primary); // turuncu tonu
print(cs.surface); // açık yüzey rengiBu iki renk, uygulamanın görsel hiyerarşisini kurar.
Uygulama ColorScheme 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 colorScheme alanı ColorScheme.fromSeed(seedColor: Colors.blue) olsun. 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 colorScheme 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(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
),
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 ColorScheme.fromSeed ne üretir?
- Bir Future nesnesi
- Metin stilleri
- Bir renk paleti Doğru cevap
- Navigasyon yolları
Açıklama: ColorScheme.fromSeed tek bir tohum renkten primary, surface gibi tüm palet renklerini üretir. Metin stilleri TextTheme'in işidir, navigasyon yolları GoRouter'ın, Future ise async işlemlerindir.
2 ColorScheme.fromSeed çağrısı
colorScheme: ____(seedColor: Colors.blue),colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),Açıklama: ColorScheme.fromSeed, tohum renkten palet üreten metottur. ColorPalette diye bir sınıf yoktur, ThemeData tema nesnesidir, Colors ise renk sabitlerini içerir; bunlar palet üretmez.
3 ColorScheme parçaları
| Kavram | Anlamı |
|---|---|
ColorScheme |
renk paleti sınıfı |
primary |
ana renk |
surface |
yüzey rengi |
fromSeed |
tohumdan palet üretme |