Flutter Cardをグリッドで表示するサンプル

環境
Windows11 pro 64bit
Flutter 3.3.7

構文

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
GridView.count(
crossAxisCount: /*数値*/,
children: [
Card(),
xxx
GridView.count( crossAxisCount: /*数値*/, children: [ Card(), xxx
GridView.count(
  crossAxisCount: /*数値*/,
  children: [
    Card(),
    xxx

Cardをグリッドで表示するには、GridView.countを使います。
引数「children」にグリッドとして表示するCardのリストを指定します。

使用例

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
final _colors = [
Colors.gray,
Colors.green,
Colors.red,
];
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: GridView.count(
crossAxisCount: 2,
children: [
処理コード
],
),
),
);
}
final _colors = [ Colors.gray, Colors.green, Colors.red, ]; @override Widget build(BuildContext context) { return Scaffold( body: Center( child: GridView.count( crossAxisCount: 2, children: [ 処理コード ], ), ), ); }
final _colors = [
   Colors.gray,
   Colors.green,
   Colors.red,
 ];

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     body: Center(
       child: GridView.count(
         crossAxisCount: 2,
         children: [
           処理コード
         ],
       ),
     ),
   );
 }

 

Flutter

Posted by arkgame