2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

[Flutter] 今のコードをちょっとよくする(constants編 その1)

Last updated at Posted at 2023-02-01

こんにちわ。いせきです。

私は今大学4年生なのでもうすぐ卒業です。寂しいです。
来年度は、大学院+社会人をやっていくので修羅の道になりますが、頑張っていこうと思います。

さて、「今のコードをちょっとよくする」シリーズもいい感じに集まってきましたね!!(2個ぐらいしかないと思っていました。)

今回は、定数を定義していこうと思います。

そうすることで

・保守性が上がる。
・重複を減らしコードの可読性が高められる。
・コンパイラが定数値を最適化し、パフォーマンスが向上する
・定数を強く型付けすることができ、コンパイル時のエラーを発見しやすくなる
・メンテナンスが容易になる

どうでしょうか?これだけでもいいコードになりそうですね。

使い方

以下の値は、定数なので、static(静的)、constにて定義してあげる。
詳しくは以下のコードを参考にしてください。

今回は、色を定数化していこうと思います(別の種類もあります。別の記事にて。。)

import 'package:flutter/material.dart';

class ColorConstants {
  static Color appBarColor = const Color(0xFF4A67AD);
  static Color backgroundColor = const Color(0xFFF2F2F7);
  static Color settingsListBackground = const Color(0xFFF2F2F7);
  static Color settingsSectionBackground = Colors.white;
  static Color yellow = Colors.yellow;
  static Color lightBlue = Colors.lightBlue;
  static Color blue = Colors.blue;
  static Color grey = Colors.grey;
  static Color black = Colors.black;
  static Color white = Colors.white;
  static Color red = Colors.red;
}

作成した定数を他のファイルから使用したいときには以下のようにして呼び出す必要があります。

import 'package:flutter/material.dart';
import 'package:sample_app/constants/color_constants.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Qiita Flutter',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int counter = 0;

  void _incrementCounter() {
    setState(() {
      counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Qiita Flutter App')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'You have pushed the button this many times:',
              style: TextStyle(
                //繰り返し使える
                color: ColorConstants.appBarColor,
              ),
            ),
            Text(
              '$counter',
              style: TextStyle(
                //繰り返し使える
                color: ColorConstants.appBarColor,
              ),
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ),
    );
  }
}



最後に

ChatGPT便利じゃないですか??わからなくなったら聞いてみることでアドバイスがもらえる。改めてですが革新だなと思っていました。(最初は食わず嫌いで使っていませんでした。)
記事で回答に困ったら使えるので記事要らなくね?と思うこともありますが、自分自身のアウトプットのために頑張ります〜〜〜!!!!

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?