渲染溢出,无法找到问题的根源

时间:2019-08-16 09:35:37

标签: flutter flutter-layout

嗨,我正在使用Flutter创建登录屏幕,当我在TextField小部件上点击时,Render Flex溢出了。

我添加了SingleChildScrollView小部件,但仍显示相同的警告。我也在使用screen_util插件来标准化任何设备的大小

这是我的auth_screen.dart

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import '../widgets/ui_elements/color_contants.dart';
import '../widgets/main_widget_elements/login_card.dart';

class NewAuthScreen extends StatefulWidget {
  @override
  _NewAuthScreenState createState() => _NewAuthScreenState();
}

class _NewAuthScreenState extends State<NewAuthScreen> {
  bool _isSelected = false;

  void _radio() {
    setState(() {
      _isSelected = !_isSelected;
    });
  }

  Widget radioButton(bool isSelected) => Container(
        width: 16.0,
        height: 16.0,
        padding: EdgeInsets.all(2.0),
        decoration: BoxDecoration(
          shape: BoxShape.circle,
          border: Border.all(width: 2.0, color: Colors.black),
        ),
        child: isSelected
            ? Container(
                width: double.infinity,
                height: double.infinity,
                decoration:
                    BoxDecoration(shape: BoxShape.circle, color: Colors.black),
              )
            : Container(),
      );

  @override
  Widget build(BuildContext context) {
    ScreenUtil.instance = ScreenUtil.getInstance()..init(context);
    ScreenUtil.instance =
        ScreenUtil(width: 780, height: 1200, allowFontScaling: true);
    return Scaffold(
      backgroundColor: Color.fromRGBO(255, 250, 250, 2.0),
      resizeToAvoidBottomPadding: true,
      body: Stack(
        fit: StackFit.expand,
        children: <Widget>[
          Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            children: <Widget>[
              Padding(
                padding: EdgeInsets.only(top: 10.0),
                child: Image.asset("assets/image_01.png"),
              ),
              Expanded(
                child: Container(),
              ),
              Image.asset("assets/image_02.png")
            ],
          ),
          SingleChildScrollView(
            scrollDirection: Axis.vertical,
            child: Padding(
              padding: EdgeInsets.only(left: 28.0, right: 28.0, top: 50.0),
              child: Column(
                children: <Widget>[
                  Row(
                    children: <Widget>[
                      // Image.asset(
                      //   'assets/logo.png',
                      //   width: ScreenUtil.getInstance().setWidth(110),
                      //   height: ScreenUtil.getInstance().setHeight(110),
                      // ),
                      Text(
                        'PINKBOOK',
                        style: TextStyle(
                            fontFamily: 'PoppinsBold',
                            fontSize: ScreenUtil.getInstance().setSp(46),
                            letterSpacing: .6,
                            fontWeight: FontWeight.bold),
                      )
                    ],
                  ),
                  SizedBox(
                    height: ScreenUtil.getInstance().setHeight(190),
                  ),
                  FormCard(),
                  SizedBox(
                    height: ScreenUtil.getInstance().setHeight(20),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Row(
                        children: <Widget>[
                          SizedBox(
                            width: 12.0,
                          ),
                          GestureDetector(
                            onTap: _radio,
                            child: radioButton(_isSelected),
                          ),
                          SizedBox(
                            width: 8.0,
                          ),
                          Text(
                            'Remember Me',
                            style: TextStyle(
                                fontSize: 12, fontFamily: 'PoppinsMedium'),
                          )
                        ],
                      ),
                      InkWell(
                        child: Container(
                          width: ScreenUtil.getInstance().setWidth(330),
                          height: ScreenUtil.getInstance().setHeight(100),
                          decoration: BoxDecoration(
                              gradient: LinearGradient(colors: [
                                Color(0xFF17ead9),
                                Color(0xFF6078ea)
                              ]),
                              borderRadius: BorderRadius.circular(6.0),
                              boxShadow: [
                                BoxShadow(
                                    color: Color(0xFF6078ea).withOpacity(0.3),
                                    offset: Offset(0.0, 8.0),
                                    blurRadius: 8.0)
                              ]),
                          child: Material(
                            color: Colors.transparent,
                            child: InkWell(
                              onTap: () {},
                              child: Center(
                                child: Text(
                                  'Sign-In',
                                  style: TextStyle(
                                      color: Colors.white,
                                      fontFamily: 'PoppinsBold',
                                      fontSize: 18,
                                      letterSpacing: 1.0),
                                ),
                              ),
                            ),
                          ),
                        ),
                      )
                    ],
                  ),
                  SizedBox(
                    height: ScreenUtil.getInstance().setHeight(30),
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Text(
                        'New User?',
                        style: TextStyle(
                          fontFamily: 'PoppinsMedium'
                        ),
                      ),
                      InkWell(
                        onTap: () {},
                        child: Text(
                          'Signup',
                          style: TextStyle(color: Color(0xFF5d74e3),
                          fontFamily: 'PoppinsBold'),
                        ),
                      )
                    ],
                  )
                ],
              ),
            ),
          )
        ],
      ),
    );
  }
}

这是我的login_card.dart

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class FormCard extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: ScreenUtil.getInstance().setHeight(490),
      decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(8.0),
          boxShadow: [
            BoxShadow(
                color: Colors.black12,
                offset: Offset(0.0, -1.0),
                blurRadius: 10.0)
          ]),
      child: Padding(
        padding: EdgeInsets.only(left: 16.0, right: 16.0, top: 16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text(
              'Login',
              style: TextStyle(
                  fontSize: 24.0,
                  fontFamily: 'PoppinsBold',
                  letterSpacing: .6),
            ),
            SizedBox(
              height: ScreenUtil.getInstance().setHeight(20),
            ),
            Text(
              'Username',
              style: TextStyle(
                  fontFamily: 'PoppinsMedium',
                  fontSize: 15.0),
            ),
            TextField(
              decoration: InputDecoration(
                  hintText: 'username',
                  hintStyle: TextStyle(fontSize: 12.0, color: Colors.grey)),
            ),
            SizedBox(
              height: ScreenUtil.getInstance().setHeight(20),
            ),
            Text(
              'Password',
              style: TextStyle(
                  fontFamily: 'PoppinsMedium',
                  fontSize: ScreenUtil.getInstance().setSp(26)),
            ),
            TextField(
              obscureText: true,
              decoration: InputDecoration(
                  hintText: 'password',
                  hintStyle: TextStyle(fontSize: 12.0, color: Colors.grey)),
            ),
            SizedBox(
              height: ScreenUtil.getInstance().setHeight(35),
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: <Widget>[
                Text(
                  'Forgot Password?',
                  style: TextStyle(
                    color: Colors.blue,
                    fontFamily: 'PoppinsMedium',
                    fontSize: ScreenUtil.getInstance().setSp(28),
                  ),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}

0 个答案:

没有答案