Блог

Главная - Вопросы по программированию - версия Android или проблема с пикселями в flutter?

версия Android или проблема с пикселями в flutter?

#android #flutter #android-layout #flutter-layout

#Android #флаттер #android-макет #флаттер-макет

Вопрос:

Я новичок в разработке приложений Flutter (~ 1 месяц). Я получаю ошибку в коде, в котором тот же код работает нормально в pixel 2XL (размер: — 5.99, API -: 29), но когда я запускаю тот же код в galaxy Nexus (размер: 4.65, API-: 23), он не выполняется одинаково.введите описание изображения здесьЭто простая страница в формате pixel 2XLвведите описание изображения здесь, это та же страница в Galaxy nexus

 import 'package:flutter/material.dart';


class page1 extends StatefulWidget {
  @override
  _page1State createState() => _page1State();
}

class _page1State extends State<page1> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.blue,
        body: Container(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisSize: MainAxisSize.max,
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: <Widget>[
                Container(
                  height: 300,
                  width: 200,
                  child: Image.asset(
                    'assets/oreo.png',
                    fit: BoxFit.fitHeight,
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.only(left: 15),
                  child: Row(
                    children: <Widget>[
                      Column(
                        children: <Widget>[
                          Text(
                            "mytime is an initiative",
                            style: TextStyle(
                              fontSize: 20,
                              fontWeight: FontWeight.w300,
                              letterSpacing: 2.5,
                              color: Colors.white,
                            ),
                          ),
                          Text(
                            "by XYZ Texhnologies",
                            style: TextStyle(
                              fontSize: 20,
                              fontWeight: FontWeight.w300,
                              letterSpacing: 2.5,
                              color: Colors.white,
                            ),
                          ),
                          Text(
                            "to provide quality",
                            style: TextStyle(
                              fontSize: 20,
                              fontWeight: FontWeight.w300,
                              letterSpacing: 2.5,
                              color: Colors.white,
                            ),
                          ),
                          Text(
                            "programming education to people",
                            style: TextStyle(
                              fontSize: 20,
                              fontWeight: FontWeight.w300,
                              letterSpacing: 2.5,
                              color: Colors.white,
                            ),
                          ),
                      
                          SizedBox(height: 20,),
                        ],
                      ),
                    ],
                  ),
                ),
              ],
            ),
        ),
    );
  }
}

это код для страницы.

Я понятия не имею, почему это происходит. кто-нибудь может мне помочь с этим? заранее благодарю вас.

Комментарии:

1. Ваш текст слишком большой на pixel 2XL. Попробуйте настроить размер шрифта текста в зависимости от размера / экрана мобильного устройства.

2. но когда я уменьшаю размер шрифта, он отлично работает в galaxy, но затем в pixel 2 он перемещается в левую сторону!!

3. попробуйте обернуть столбец родительского виджета с помощью расширенной строки виджета> Расширенный> Столбец или добавить mainAxisAlignment в свою строку строку (mainAxisAlignment: MainAxisAlignment.center, ), .. если это не так, попробуйте перекрестное выравнивание в столбце

Ответ №1:

Желтая черная полоса означает, что вы «переполнены». Переполнение означает, что элемент слишком велик для своего контейнера.

В вашем конкретном случае шрифт текста и интервал слишком велики, и при смене телефона, поскольку вы не настроили его динамически для адаптации к разным размерам экрана, он выходит за рамки.

Вы можете либо уменьшить размер шрифта, либо установить его динамически.

Если вы новичок в Flutter, я рекомендую этот курс, чтобы получить такие основы.

—> https://www.udemy.com/course/learn-flutter-dart-to-build-ios-android-apps /

Я взял это сам, и это очень хорошо объяснено и переходит от базовых тем, подобных этой, к сложным.

Надеюсь, это поможет вам больше, чем просто ответить на вопрос.