Q&A
実現したいこと
Contanaierの子Widgetを上に移動させたいです。
添付した画像のContanaierの中身(枠線の中)を全体的に上に移動させたいのですが、子Widgetの位置が固定?されており上の方に移動させることができません(移動というより最下部に隙間をつくりたい)。
どうやれば移動させることができるのでしょうか?
前提
勉強がてらTwitterの通知画面を作成しています。
該当のソースコード
Dart
1import 'package:flutter/material.dart'; 2import 'package:flutter/gestures.dart'; 3 4void main() { 5 runApp(MyApp()); 6} 7 8class MyApp extends StatelessWidget { 9 const MyApp({super.key}); 10 11 12 Widget build(BuildContext context) { 13 return MaterialApp( 14 home: const MyHomePage(), 15 ); 16 } 17} 18 19class MyHomePage extends StatefulWidget { 20 const MyHomePage({super.key}); 21 22 23 State<MyHomePage> createState() => _MyHomePageState(); 24} 25 26class _MyHomePageState extends State<MyHomePage> { 27 28 Widget build(BuildContext context) { 29 final double deviceHeight = MediaQuery.of(context).size.height; //デバイスの高さ 30 final double deviceWdth = MediaQuery.of(context).size.width; //デバイスの幅 31 return Scaffold( 32 body: Center( 33 child: Container( 34 height: deviceHeight * 0.1, 35 padding: EdgeInsets.only(bottom: deviceHeight * 0.0), 36 decoration: BoxDecoration( 37 border: Border.all(color: Colors.red), 38 borderRadius: BorderRadius.circular(10), 39 ), 40 child: Row( 41 children: [ 42 Row( 43 children: [ 44 SizedBox( 45 width: deviceWdth * 0.07, 46 ), 47 Column( 48 mainAxisAlignment: MainAxisAlignment.center, 49 crossAxisAlignment: CrossAxisAlignment.start, 50 children: [ 51 Row( 52 children: [ 53 Icon( 54 Icons.favorite, 55 color: Color.fromARGB(255, 237, 79, 158), 56 size: deviceWdth * 0.05, 57 ), 58 SizedBox( 59 width: deviceWdth * 0.03, 60 ), 61 Icon( 62 Icons.pending, 63 color: Color.fromARGB(255, 237, 79, 158), 64 size: deviceWdth * 0.05, 65 ), 66 SizedBox( 67 width: deviceWdth * 0.673, 68 ), 69 IconButton( 70 padding: EdgeInsets.only( 71 bottom: deviceHeight * 0.02, 72 ), 73 splashRadius: deviceWdth * 0.025, 74 splashColor: Colors.transparent, 75 onPressed: () => Navigator.of(context).pop(), 76 icon: const Icon(Icons.clear), 77 color: const Color.fromARGB(255, 183, 183, 183), 78 iconSize: deviceWdth * 0.05, 79 ), 80 ], 81 ), 82 Row( 83 children: [ 84 SizedBox( 85 width: deviceWdth * 0.08, 86 ), 87 Text.rich( 88 TextSpan( 89 children: [ 90 TextSpan( 91 recognizer: TapGestureRecognizer() 92 ..onTap = null, 93 text: '名前', 94 style: TextStyle( 95 color: Colors.black, 96 fontWeight: FontWeight.w600, 97 fontSize: deviceWdth * 0.035, 98 decoration: TextDecoration.underline), 99 ), 100 TextSpan( 101 text: 'さんがいいねしました', 102 style: TextStyle( 103 color: Colors.black, 104 fontWeight: FontWeight.w500, 105 fontSize: deviceWdth * 0.035, 106 ), 107 ), 108 ], 109 ), 110 ), 111 ], 112 ), 113 ], 114 ), 115 ], 116 ), 117 ], 118 ), 119 ), 120 )); 121 } 122} 123
試したこと
paddingをつかったり、sizedBoxを使ったのですが、移動させることはできませんでした。
補足情報(FW/ツールのバージョンなど)
[✓] Flutter (Channel stable, 3.7.0, on macOS 13.1 22C65 darwin-arm64, locale ja-JP)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 14.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] VS Code (version 1.73.0)
[✓] Connected device (3 available)
[✓] HTTP Host Availability
回答1件
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。