Flutter HEX Renk Kodu Kullanma

Bu yazımda, flutterda hex renk kodu ‘nun nasıl kullanılacağını göstereceğim. HEX renk kodu olarak da bilinen onaltılık renk kodu, en popüler renk dizilerinden biridir.

Hex renk kodu nasıl tanımlanır;

Aşağıdaki örnekte olduğu gibi, Flutter’da Color sınıfını kullanarak, Flutter’da HEX Renk kodunu kullanabilirsiniz. (Onaltılık renk kodunda 0xff önekine ihtiyacımız var.)

Color(0xFF + Hex Color) veya Color(0xff + Hex Color)

color: Color(0xFF42A5F5)

#1 İlk olarak material.dart paketini içe aktarın.

import 'package:flutter/material.dart';

#2 void main runApp() metodunu oluşturup MyApp sınıfını çağırıyoruz.

void main() => runApp(MyApp());

#3 Daha sonra StatelessWidget oluşturuyoruz.

class MyApp extends StatelessWidget {

}

#4 Column widget’ı içinde Text widget’ı oluşturuyoruz.

Text('Flutter Hex Color Code', 
     style: TextStyle(fontSize : 28, color: Color(0xFF42A5F5))),

#5 Tam Kod

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: SafeArea(
                child: Center(
                    child: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        Text('Flutter Hex Color Code',
            style: TextStyle(fontSize: 28, color: Color(0xFF42A5F5))),
      ],
    )))));
  }
}

Kod Çıktısı: