flutter - 单选列表平铺填充在颤动中不起作用

问题描述

我正在尝试构建一个使用单选按钮的颤振应用程序。但是收音机列表图块有很多填充，并且它们没有得到完美的显示。

我尝试将每个 MainAxisAlignment 提供给行小部件，但它们都不起作用。无论屏幕宽度如何，我都希望它们在一行中。

这是它的显示方式：

以下是我的代码：

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'LoginValidate.dart';
import 'package:url_launcher/url_launcher.dart';
import 'package:http/http.dart' as http;

class LoginScreen extends StatefulWidget {
  @override
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  int _groupValue = 0;

  @override
  Widget build(BuildContext context) {
    SystemChrome.setEnabledSystemUIOverlays([]);
    return Scaffold(
      body: SingleChildScrollView(
        scrollDirection: Axis.vertical,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Login',
              style: TextStyle(
                color: Colors.lightBlue[900],
                fontFamily: 'OpenSans',
                fontSize: 30.0,
                fontWeight: FontWeight.bold,
              ),
            ),
            SizedBox(height: 30.0),
            buildoptionsforsignin(),
          ],
        ),
      )
    );
  }

  buildoptionsforsignin() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: [
        Expanded(
          flex: 1,
          child: RadioListTile(
            value: 0,
            groupValue: _groupValue,
            title: Text("Email"),
            onChanged: (newValue) =>
                setState(() => _groupValue = newValue),
            activeColor: Colors.lightBlue[900],
            selected: true,
          ),
        ),
        Expanded(
          flex: 1,
          child: RadioListTile(
            value: 1,
            groupValue: _groupValue,
            title: Text("Phone"),
            onChanged: (newValue) =>
                setState(() => _groupValue = newValue),
            activeColor: Colors.lightBlue[900],
            selected: false,
          ),
        ),
        Expanded(
          flex: 1,
          child: RadioListTile(
            value: 2,
            groupValue: _groupValue,
            title: Text("Username"),
            onChanged: (newValue) =>
                setState(() => _groupValue = newValue),
            activeColor: Colors.lightBlue[900],
            selected: false,
          ),
        ),
      ],
    );
  }

}

谁能帮帮我吗？

标签： flutterdart

问题在于，ListTile并且Radio是具有自己内部填充的材质小部件。contentPadding您可以通过设置和dense参数来覆盖它：

RadioListTile(
   contentPadding: EdgeInsets.all(0),
   dense: true,
   ...
),

您还可以通过更改Text Overflow参数来更改文本换行行为：

RadioListTile(
   title: Text(
       "Username", 
       overflow: TextOverflow.ellipsis,
   ),
),

如果这对您来说还不够，您最好使用InkWell, Row, ...创建自己的 ListTile 小部件

flutter - 单选列表平铺填充在颤动中不起作用

问题描述

解决方案

推荐阅读