🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
Flutter

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

Dart

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

Q&A

解決済

1回答

1449閲覧

DataTableをFittedBoxを使用し、親Widgetに収まるように配置したい

Risney

総合スコア148

Flutter

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

Dart

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

0グッド

0クリップ

投稿2021/03/20 17:52

発生している問題・エラーメッセージ

FittedBoxを使用しているが、
親のWidgetにぴったりに収まらず、
余白が発生してしまう。
イメージ説明

該当のソースコード

dart

1import 'package:flutter/material.dart'; 2 3void main() => runApp(MyApp()); 4 5class MyApp extends StatelessWidget { 6 static const String _title = '【Flutter#56】DataTable'; 7 8 9 Widget build(BuildContext context) { 10 return MaterialApp( 11 title: _title, 12 home: Scaffold( 13 appBar: AppBar(title: const Text(_title)), 14 body: MyStatelessWidget(), 15 ), 16 ); 17 } 18} 19 20class MyStatelessWidget extends StatelessWidget { 21 MyStatelessWidget({Key key}) : super(key: key); 22 23 24 Widget build(BuildContext context) { 25 return SingleChildScrollView( 26 scrollDirection: Axis.vertical, 27 child:FittedBox( 28 child:DataTable( 29 sortColumnIndex: 1, 30 sortAscending: true, 31 columns: const <DataColumn>[ 32 DataColumn( 33 label: Text( 34 'Name', 35 style: TextStyle(fontStyle: FontStyle.italic), 36 ), 37 numeric: true, 38 ), 39 DataColumn( 40 label: Text( 41 'Age', 42 style: TextStyle(fontStyle: FontStyle.italic), 43 ), 44 ), 45 DataColumn( 46 label: Text( 47 'Role', 48 style: TextStyle(fontStyle: FontStyle.italic), 49 ), 50 ), 51 ], 52 rows: const <DataRow>[ 53 DataRow( 54 selected: true, 55 cells: <DataCell>[ 56 DataCell(Text('Sarah')), 57 DataCell(Text('19')), 58 DataCell(Text('selected true')), 59 ], 60 ), 61 DataRow( 62 cells: <DataCell>[ 63 DataCell(Text('Janine')), 64 DataCell(Text('43')), 65 DataCell(Text('showEditIcon'), 66 showEditIcon: true, 67 ), 68 ], 69 ), 70 DataRow( 71 cells: <DataCell>[ 72 DataCell(Text('William')), 73 DataCell(Text('27')), 74 DataCell(Text('placeholder'), 75 placeholder: true, 76 ), 77 ], 78 ), 79 ], 80 ) 81 ) 82 ); 83 } 84}

試したこと

【Flutter備忘録】DataTableを親Widgetに収まるように配置する

上記のサイトを参考に、
下記のようにFiitedBoxを使用しましたが、
期待した結果にはなりませんでした。

dart

1SingleChildScrollView( 2 child:FittedBox( 3 child:DataTable(

補足情報(FW/ツールのバージョンなど)

公式Youtube
公式ドキュメント

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

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

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

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

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

guest

回答1

0

ベストアンサー

FiitedBoxの代わりにSizedBoxを使用する方法ならできました。

dart

1 return SingleChildScrollView( 2 scrollDirection: Axis.vertical, 3 child: SizedBox( 4 width: double.infinity, 5 child: DataTable(

投稿2021/04/09 12:28

satokei

総合スコア1217

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

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

Risney

2021/04/21 16:05

回答ありがとうございます。 FittedBoxでなんとかしたく踏ん張っています。。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.36%

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

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

質問する

関連した質問