Flutter Bottom 被像素溢出，尝试了 Column()、Row()、Container() 等等

Posted 2023-02-23

【中文标题】Flutter Bottom 被像素溢出，尝试了 Column()、Row()、Container() 等等

【英文标题】：Flutter Bottom over flowed by pixels, tried Column(), Row(), Container() and many many more things

【发布时间】：2021-10-09 12:27:17

【问题描述】：

Flutter Bottom 溢出了像素，尝试了 Column()、Row()、Container() 以及更多其他方法，但没有任何帮助解决我的问题。我在这里分享完整的代码，请看一下。

如果有人知道问题出在哪里，请帮助我。

Flutter Bottom 溢出了像素，尝试了 Column()、Row()、Container() 以及更多其他方法，但没有任何帮助解决我的问题。我在这里分享完整的代码，请看一下。

如果有人知道问题出在哪里，请帮助我。

import 'dart:io';

import 'package:app_settings/app_settings.dart';
import 'package:connectivity/connectivity.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:giffy_dialog/giffy_dialog.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:url_flutter_app/screens/Dash_board.dart';
import 'package:url_flutter_app/screens/Search.dart';
import 'package:unicorndial/unicorndial.dart';
import 'package:url_launcher/url_launcher.dart';

class Dashboard extends StatefulWidget 
  static const routeName = '/home1';
  @override
  DashboardState createState() => new DashboardState();


class DashboardState extends State<Dashboard> 

  StreamSubscription connectivitySubscription;
  ConnectivityResult _previousResult;

  bool dialogshown = false;

  Future<bool> checkinternet() async 
    try 
      final result = await InternetAddress.lookup('google.com');
      if (result.isNotEmpty && result[0].rawAddress.isNotEmpty) 
        return Future.value(true);
      
     on SocketException catch (_) 
      return Future.value(false);
    
  

  @override
  void initState() 
    super.initState();

    connectivitySubscription = Connectivity()
        .onConnectivityChanged
        .listen((ConnectivityResult connresult) 
      if (connresult == ConnectivityResult.none) 
        dialogshown = true;

        showDialog(
            context: context,
            builder: (_) => AssetGiffyDialog(
                  image: Image.asset(
                    'assets/1fqC.gif',
                    fit: BoxFit.cover,
                  ),
                  title: Text(
                    'Error',
                    textAlign: TextAlign.center,
                    style: TextStyle(
                        fontSize: 18.0, fontWeight: FontWeight.w600),
                  ),
                  entryAnimation: EntryAnimation.BOTTOM_RIGHT,
                  description: Text(
                    "No Internet Detected, Please Enable your Internet Connection and try again. Thank You. \n"
                        "Press 'OK' to turn on your mobile data or WiFi connection, or press 'Cancel' to exit the app.",
                    textAlign: TextAlign.center,
                    style: TextStyle(fontWeight: FontWeight.bold),
                  ),
                  onOkButtonPressed: () 
                    //_onAlertButtonsPressed(context);
                    AppSettings.openDeviceSettings();
                  ,
                  onCancelButtonPressed: ()
                    SystemNavigator.pop(); //for android from flutter/services.dart
                    exit(0);
                  ,
                ),
        );

         else if (_previousResult == ConnectivityResult.none) 
        checkinternet().then((result) 
          if (result == true) 
            if (dialogshown == true) 
              dialogshown = false;
              Navigator.pop(context);
            
          
        );
      

      _previousResult = connresult;
    );
  

  @override
  void dispose() 
    super.dispose();

    connectivitySubscription.cancel();
  

  @override
  Widget build(BuildContext context) 
    var floatingButtons = List<UnicornButton>();
    floatingButtons.add(
      UnicornButton(
        hasLabel: true,
        labelText: "Search Map",
        currentButton: FloatingActionButton(
          heroTag: "Search Map",
          backgroundColor: Colors.deepPurple,
          mini: true,
          child: Icon(Icons.search_rounded),
          onPressed: () 
            Navigator.push(context, MaterialPageRoute(builder: (context)=> Search()));
          ,
        ),
      ),
    );
    floatingButtons.add(
      UnicornButton(
        hasLabel: true,
        labelText: "Facebook Page",
        currentButton: FloatingActionButton(
          onPressed: _facebook,
          heroTag: "facebook",
          backgroundColor: Colors.deepPurple,
          mini: true,
          child: Icon(Icons.facebook),
        ),
      ),
    );
    floatingButtons.add(
      UnicornButton(
        hasLabel: true,
        labelText: "Our Website",
        currentButton: FloatingActionButton(
          onPressed: _website,
          heroTag: "website",
          backgroundColor: Colors.deepPurple,
          mini: true,
          child: Icon(Icons.open_in_browser),
        ),
      ),
    );
    floatingButtons.add(
      UnicornButton(
        hasLabel: true,
        labelText: "Whatsapp us",
        currentButton: FloatingActionButton(
          onPressed: _whatsapp,
          heroTag: "whatsapp",
          backgroundColor: Colors.deepPurple,
          mini: true,
          child: Icon(Icons.whatshot),
        ),
      ),
    );

    return Scaffold(
      floatingActionButton: UnicornDialer(
          backgroundColor: Colors.black38,
          parentButtonBackground: Colors.deepPurple,
          orientation: UnicornOrientation.VERTICAL,
          parentButton: Icon(Icons.message_outlined),
          childButtons: floatingButtons),
      body: Column(
        children: <Widget>[
          SizedBox(
            height: 110,
          ),
          Padding(
            padding: EdgeInsets.only(left: 16, right: 16),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: <Widget>[
                    Text(
                      "  ColorLine",
                      style: GoogleFonts.breeSerif(
                          textStyle: TextStyle(
                              color: Colors.black87,
                              fontSize: 36,
                              fontWeight: FontWeight.bold)),
                    ),
                    SizedBox(
                      height: 0,
                    ),
                    Text(
                      "    Maps",
                      style: GoogleFonts.breeSerif(
                          textStyle: TextStyle(
                              color: Color(0xff000000),
                              fontSize: 24,
                              fontWeight: FontWeight.w600)),
                    ),
                  ],
                ),
                IconButton(
                  iconSize: 110,
                  alignment: Alignment.center,
                  icon: Image.asset(
                    "assets/Final_Logo.png",
                    width: 100,
                    height: 100,
                  ),
                  onPressed: () ,
                )
              ],
            ),
          ),
          SizedBox(
            height: 40,
          ),
          GridDashboard()
        ],
      ),
    );
  


_whatsapp() async 
  const url = 'https://wa.me/16694002123';
  if (await canLaunch(url)) 
    await launch(url);
   else 
    throw 'Could not launch $url';
  


_facebook() async 
  const url = 'https://www.facebook.com/colorline7007/';
  if (await canLaunch(url)) 
    await launch(url);
   else 
    throw 'Could not launch $url';
  


_website() async 
  const url = 'https://colorline.pk';
  if (await canLaunch(url)) 
    await launch(url);
   else 
    throw 'Could not launch $url';
  
 ```

【问题讨论】：

去这里我的答案***.com/a/68646487/13997210

【参考方案1】：

只需将您的 Column 包裹在 SingleChildScrollView 中或将其替换为 ListView。

您的视图溢出，因为它不可滚动并且没有足够的空间来呈现内容。

【讨论】：

已经试过了，可以在你的系统上运行吗？

不，不在那里。您需要将Column 包裹在 just 一个 SingleChildScrollView 而非两者中。

嗯，它不是一个列，它是一个“ShowDialog()”。

如何包装“ShowDialog”？

你需要包裹内栏。您不能包装 showDialog，因为它是叠加层中的模态渲染。