Flutterで、Columnの中にRowを追加するとレイアウトされなくなる。

Question

前提

Flutterを使用してアプリを作成しています。
その中でレイアウトに関して詰まっています。

Columnを使って縦に複数のWidgetを並べるのですが、
その中の１Widgetの中身を横向きに並べたいと考えています。

そこでColumnと入れ子になる形でRowを入れたのですが、
エラーが発生し、レイアウトされません。

実現したいこと

以下のイメージのように、画面全体はColumnを使用して縦にWidgetを並べると同時に、
最初だけ横向きにWidgetを並べるようにしたいです。

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

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
RenderBox was not laid out: RenderRepaintBoundary#59217 relayoutBoundary=up2 NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1979 pos 12: 'hasSize'
The relevant error-causing widget was: 
  Column Column:file:///C:/src/delivery_management-master/lib/Page/My/SignUpPage.dart:121:15
════════════════════════════════════════════════════════════════════════════════════════════════════

該当のソースコード

import 'package:delivery_management/Common.dart';
import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart';

import '../../Communication/UserData.dart';
import '../TabPage.dart';

// 新規登録ページ
class SignUpPage extends StatefulWidget {
  const SignUpPage({Key? key}) : super(key: key);

  @override
  _SignUpPageState createState() => _SignUpPageState();
}

class _SignUpPageState extends State<SignUpPage> {
  // 入力チェックに用いる一意なキー
  final formKeySignUp = GlobalKey<FormState>();

  // 登録するユーザのカテゴリ:
  bool userCategoryNinushi = false;
  bool userCategoryHaisou = false;

  // メールアドレスのTextEditingController
  final mailController = TextEditingController();

  // パスワードのTextEditingController
  final passwordController = TextEditingController();

  // 住所のTextEditingController
  final addressController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text("新規登録"),
        ),
        body: Column(children: <Widget>[
          Expanded(child: SingleChildScrollView(child: Form(
              key: formKeySignUp,
              child: Align(
                alignment: Alignment.topCenter,
                child: Card(child: ConstrainedBox(
                    constraints: const BoxConstraints(maxWidth: 400),
                    child: Padding(
                      padding: const EdgeInsets.all(10.0),
                      child: Column(children: [
                        //ここでRowを入れるとレイアウトが表示されない
                        Row(children:<Widget> [ 
                          CheckboxListTile(
                            value: userCategoryNinushi,
                            title: const Text(
                              'サンプル１',
                              style: TextStyle(
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                            controlAffinity: ListTileControlAffinity.leading,
                            onChanged: (value) {
                              setState(() {
                                userCategoryNinushi = value!;
                              });
                            },
                          ),
                          CheckboxListTile(
                            value: userCategoryHaisou,
                            title: const Text(
                              'サンプル２',
                              style: TextStyle(
                                fontWeight: FontWeight.bold,
                              ),
                            ),
                            controlAffinity: ListTileControlAffinity.leading,
                            onChanged: (value) {
                              setState(() {
                                userCategoryHaisou = value!;
                              });
                            },
                          ),
                        ],),
                        TextFormField(
                          controller: mailController,
                          keyboardType: TextInputType.emailAddress,
                          decoration: const InputDecoration(
                              labelText: "メールアドレス"),
                          validator: (value) {
                            if (value!.isEmpty) {
                              return '未入力です';
                            }
                            return null;
                          },
                          textInputAction: TextInputAction.next,
                        ),

                        TextFormField(
                          controller: passwordController,
                          keyboardType: TextInputType.visiblePassword,
                          obscureText: isHiddenPassword,
                          decoration: InputDecoration(
                            labelText: "パスワード",
                            suffixIcon: IconButton(
                                icon: Icon(isHiddenPassword
                                    ? Icons.remove_red_eye
                                    : Icons.visibility_off),
                                onPressed: () {
                                  setState(() {
                                    isHiddenPassword = !isHiddenPassword;
                                  });
                                }),
                          ),
                          validator: (value) {
                            if (value!.isEmpty) {
                              return '未入力です';
                            }
                            return null;
                          },
                          textInputAction: TextInputAction.next,
                        ),

                        TextFormField(
                          controller: addressController,
                          keyboardType: TextInputType.text,
                          decoration: const InputDecoration(labelText: "住所"),
                          validator: (value) {
                            if (value!.isEmpty) {
                              return '未入力です';
                            }
                            return null;
                          },
                          textInputAction: TextInputAction.next,
                        ),
                      ],),
                    )
                ),),
              )
          ))),

          Padding(
              padding: const EdgeInsets.all(10),
              child: MaterialButton(
                padding: const EdgeInsets.all(20),
                color: Colors.red,
                onPressed: onclickRegistrationButton,
                child: const Text("登録"),
                textColor: Colors.white,)
          ),
        ])
      ),);
  }

試したこと

RowをExpandedで囲んでみましたが、状況は変わりませんでした。
Expandedで囲んだ時、Rowの前にはchildをつけています。

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

AndroidStudio4.01
flutter 3.0.5

Answer 1

Rowの方ではなくCheckboxListTile両方をそれぞれExpandedで囲めばうまくいきませんか？

                              Expanded(
                                child: CheckboxListTile(

Rowの子供として幅を調整(事前決定)するウィジェットを配置しておかないと、Rowの直下にCheckboxListTileだとCheckboxListTileの幅が決まらないんだと思います。

Comments

[Y.Mamoru]

返答がおそくなってしまってすみません！
こちらは教えていただいた方法で解消できました！
ありがとうございます(^^)