質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

解決済

クラスの正しい使い方につきまして

mako_0221
mako_0221

総合スコア61

Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

2回答

0リアクション

1クリップ

562閲覧

投稿2022/08/12 15:15

クラスやオブジェクト指向についてDart言語+FlutterSDKを通じて学んでいるのですが、下記のところまで記載して考え方や実際に適用する方法がわからなくなってしまいました。関連するところについて//**でマーキングさせて頂きました。

TextFieldEmail()ウィジェットとTextFieldPasswordウィジェットを並べているのですが、コードの通り、殆どが共通しております。実際にはこれらのクラスを分けずに共通する部分を束ねることがクラスの一つの役割かと思っているのですが、このケースでは「どのように束ねるべきか」がわかりません。

コンストラクタ時点で分岐させて分けて一つのクラスで管理するのか、親クラスのような物を作って、それぞれの子クラスに継承させて複数クラスで管理するのかイメージがわきません。

稚拙は承知で申し訳ございませんが、本件であれば、「一般的にはこのようにします」のようなアドバイスをいただけると大変有難いです。
よろしくお願い申し上げます。

Dart

//main.dart import 'package:cards/view/textfield.dart'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; void main() { runApp( ProviderScope( child: MaterialApp( title: 'Demo', home: RegisterWidget(), ), ), ); } class RegisterWidget extends ConsumerWidget { Widget build(BuildContext context, WidgetRef ref) { return Scaffold( body: Padding( padding: const EdgeInsetsDirectional.fromSTEB(20, 50, 20, 0), child: Column( children: [ Container( padding: const EdgeInsetsDirectional.fromSTEB(10, 0, 10, 0), margin: const EdgeInsets.only(top: 30), width: double.infinity, child: Column( children: [ Align( alignment: const AlignmentDirectional(0, 0), child: TextFieldEmail(),//** ), Align( alignment: const AlignmentDirectional(0, 0), child: TextFieldPassword(),//** ), ], ), ), ], ), )); } }

Dart

import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart'; class TextFieldEmail extends ConsumerWidget { Widget build(BuildContext context, WidgetRef ref) { return Container( margin: const EdgeInsets.only(bottom: 10), child: TextFormField( style: const TextStyle( fontSize: 13, ), obscureText: true, decoration: InputDecoration( labelText: "email",//** hintText: "メールアドレス",//** suffixIcon: null,//** labelStyle: const TextStyle( fontSize: 15, color: Color.fromARGB(255, 219, 219, 219), //labelの文字の色 ), enabledBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(2), borderSide: const BorderSide( color: Color.fromARGB(255, 219, 219, 219), //outlineの文字の色 width: 1.0, ), ), focusedBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(2), borderSide: const BorderSide( color: Color.fromARGB(255, 219, 219, 219), //outline-focusの色 width: 1.0, //outlineの太さ )), ), )); } } // final mask = StateProvider((ref) => false); class TextFieldPassword extends ConsumerWidget { bool mask = false; Widget build(BuildContext context, WidgetRef ref) { return Container( margin: const EdgeInsets.only(bottom: 10), child: TextFormField( style: const TextStyle( fontSize: 13, ), obscureText: true, decoration: InputDecoration( labelText: "password",//** hintText: "パスワード",//** suffixIcon: IconButton(//** icon: Icon(mask ? FontAwesomeIcons.solidEye : FontAwesomeIcons.solidEyeSlash), onPressed: () { mask = !mask; }, ), labelStyle: const TextStyle( fontSize: 15, color: Color.fromARGB(255, 219, 219, 219), //labelの文字の色 ), enabledBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(2), borderSide: const BorderSide( color: Color.fromARGB(255, 219, 219, 219), //outlineの文字の色 width: 1.0, ), ), focusedBorder: OutlineInputBorder( borderRadius: BorderRadius.circular(2), borderSide: const BorderSide( color: Color.fromARGB(255, 219, 219, 219), //outline-focusの色 width: 1.0, //outlineの太さ )), ), )); } }

以下のような質問にはリアクションをつけましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。