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

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

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

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

Dart

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

Q&A

解決済

1回答

883閲覧

【Dart】表示されている文字を選択した文字に置き換えたい

narururu

総合スコア170

Flutter

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

Dart

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

0グッド

0クリップ

投稿2021/01/30 10:09

編集2021/01/30 14:41

解決したい課題

「くだもの」と表示されている項目をタップし、BottomSheetから選択したフルーツが「くだもの」から選択したフルーツに置き換わるようにしたい。

現状

選択したフルーツが「くだもの」の下に表示されてしまう。
イメージ説明
イメージ説明
イメージ説明

コード

import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(), ); } } class MyHomePage extends StatefulWidget { _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { String _selectedItem = ''; @override Widget build(BuildContext context) { return Scaffold( body: ListView( children: <Widget>[ ListTile( title: Text( 'くだもの', style: TextStyle( color: Colors.grey, ),), onTap: () => _onButtonPressed(), ), Text(_selectedItem), ] ), ); } void _onButtonPressed() { showModalBottomSheet( context: context, builder: (context) { return Container( color: Color(0xFF737373), height: 180, child: Container( child: _buildBottomNavigationMenu(), decoration: BoxDecoration( color: Theme.of(context).canvasColor, borderRadius: BorderRadius.only( topLeft: const Radius.circular(10), topRight: const Radius.circular(10), ), ), ), ); }); } Column _buildBottomNavigationMenu() { return Column( children: <Widget>[ ListTile( title: Text('りんご'), onTap: () => _selectItem('りんご'), ), ListTile( title: Text('みかん'), onTap: () => _selectItem('みかん'), ), ListTile( title: Text('ぶどう'), onTap: () => _selectItem('ぶどう'), ), ], ); } void _selectItem(String name) { Navigator.pop(context); setState(() { _selectedItem = name; }); } }

試したこと

_selectedItem をTextやListTileの階層に入れてみたりしましたがエラーとなってしまいます。
条件分岐式で解決できないか試したりしているのですが、解決できません。

どなたか、アドバイスをよろしくお願いいたします。

追記

replaceAllという方法を知り、試してみましたがエラーとなってしまいました。

// ignore: non_constant_identifier_names String Fruits = 'くだもの'; @override Widget build(BuildContext context) { return Scaffold( body: ListView( children: <Widget>[ ListTile( title: Text( 'くだもの', style: TextStyle( color: Colors.grey, ),), onTap: () => _onButtonPressed(), ),        Fruits.replaceAll('くだもの', _selectedItem); ] ), ); }

エラー

lib/main.dart:40:53: Error: Expected ']' before this. Fruits.replaceAll('くだも�?�', _selectedItem); ^ lib/main.dart:40:20: Error: A value of type 'String' can't be assigned to a variable of type 'Widget'.

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

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

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

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

最初の変数定義の部分で、String _selectedItem = 'くだもの';
としておいて、現在くだものと入力されている部分を、title: Text(_selectedItem)のようにしてみてはいかがでしょうか。

また追記のエラーに関してですが、Fruits.replaceAll('くだもの', _selectedItem);はString型ですので、
children:<Widget>[]の中には入れられません。
children: <Widget>[]の[]の中に入れるのは必ずWidgetですので、Text(Fruits.replaceAll('くだもの', _selectedItem))のように、StringではなくWidgetを入れましょう。

投稿2021/01/31 04:01

flutter_labo

総合スコア110

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

narururu

2021/01/31 04:22

ご回答ありがとうございます。kageさん☺ 教えていただいた方法で試してみました。わたしのイメージ通りになりました!ありがとうございます! よろしければもう1つ教えていただけると嬉しいのですが、現在「くだもの」の文字はグレーで表示されており、フルーツを選択後画面に表示される時は黒色に変化させたいです。 kageさんならどのように記述されますでしょうか。
flutter_labo

2021/01/31 05:10

Text( _selectedItem, style: TextStyle( color: _selectedItem == 'くだもの' ? Colors.grey : Colors.black, ), ), 私なら三項演算子を使いますね。 上記の記述は、「もし_selectedItemがくだものだったらgrey、それ以外ならblack」と言う意味です。 三項演算子についてわかりやすい記事があったので貼っておきます。 https://note.com/hatchoutschool/n/n391e40e78912
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問