The original

medium.com/@sheikhg190…

reference

medium.com/@sheikhg190…

The body of the

Open the Flutter Theme Tool application on your Android phone. Follow the guide to prepare a great Dart theme for your application.

Copy the generated Dart theme code to the clipboard.

To get topics on your computer, in the IDE, (for example, Visual Studio Code). Paste it into slack chat on your phone so you can get the code from Slack on your computer. On slack, enter ‘ ‘. A box will appear. Paste the clipboard contents into the box.

Optional: Follow the same steps to generate another Dart theme for dark mode.

Open your existing FLUTTER project. Create the generated_theme.dart file with the following.

import 'package:flutter/material.dart'; ThemeDataget mylightTheme {// TODO: Copy Generated Light Theme Here.
return theme;
}ThemeData get myDarkTheme {// TODO: Copy Generated Dark Theme Here.
return theme;
}
Copy the code

Replace the TODO comment with generated code.

ThemeData get mylightTheme {
// Flutter Theming Tool 1.0.0+10, developed by Tamata Soft
// Initialize ThemeData.
  var theme = ThemeData(
    primarySwatch: Colors.blue,
    brightness: Brightness.light,
  );// Main Setting.
  theme = theme.copyWith(
    colorScheme: theme.colorScheme.copyWith(
      onPrimary: const Color(0xffffffff),
      secondary: Colors.deepOrange,
    ),
  );// ElevatedButton Setting.
  theme = theme.copyWith(
    elevatedButtonTheme: ElevatedButtonThemeData(
      style: ButtonStyle(
        shape: MaterialStateProperty.all(
          const RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(16.0),
              topRight: Radius.circular(16.0),),),),),),);// OutlinedButton Setting.
  theme = theme.copyWith(
    outlinedButtonTheme: OutlinedButtonThemeData(
      style: ButtonStyle(
        shape: MaterialStateProperty.all(
          const RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(16.0),
              topRight: Radius.circular(16.0),),),),),),);// Chip Setting.
  theme = theme.copyWith(
    chipTheme: theme.chipTheme.copyWith(
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(16.0),
          bottomRight: Radius.circular(16.0),
        ),
      ),
      labelStyle: (theme.chipTheme.labelStyle).copyWith(
        color: Colors.deepOrange,
        shadows: [
          const Shadow(
            blurRadius: 2.0,
            color: Colors.grey,
          )
        ],
      ),
      secondaryLabelStyle: (theme.chipTheme.labelStyle).copyWith(
        shadows: [
          const Shadow(
            blurRadius: 2.0() [(), ((), (().return theme;
}
Copy the code

Open the main.dart file. Add the Theme property to the MaterialApp widget.

MaterialApp(
 title: 'Flutter Demo',
 theme: mylightTheme,
 ----
 ----
)
Copy the code

Required packages.

google_fonts

The elder brother of the © cat

ducafecat.tech/
github.com/ducafecat
Ducafecat WeChat group
B station space.bilibili.com/404904528

The issue of

Open source

GetX Quick Start

Github.com/ducafecat/g…

News client

Github.com/ducafecat/f…

Strapi manual translation

getstrapi.cn

Wechat discussion group Ducafecat

A series of collections

The translation

Ducafecat. Tech/categories /…