Блог

Главная - Вопросы по программированию - Нежелательное пространство между 2 контейнерами при трепетании

Нежелательное пространство между 2 контейнерами при трепетании

#flutter #dart

#флаттер #dart

Вопрос:

Нежелательное пространство между 2 контейнерами Я хочу удалить это дополнительное пространство между текстовым виджетом и представлением списка (ползунок карусели). Оба этих виджета встроены в виджет контейнера . Я не добавил никакого SizedBox или Spacer между этими 2 виджетами. Я не знаю, почему появляется это дополнительное пространство! Вот пример кода —

  class _DashBoardState extends State<DashBoard> {
   @override
  Widget build(BuildContext context) {
  return Scaffold(
    body: Column(
     children: [
       SizedBox(
         height: 50,
       ),
        Container(
         child: Text(
           'First Text Box',
           style: TextStyle(
             fontSize: 22,
           ),
         ),
       ),
       Container(
         height: 220,
        child: ListView(
          children: <Widget>[
            CarouselSlider(
              height: 180.0,
              enlargeCenterPage: true,
              autoPlay: true,
              aspectRatio: 16 / 9,
              autoPlayCurve: Curves.fastOutSlowIn,
              enableInfiniteScroll: true,
              autoPlayAnimationDuration: Duration(milliseconds: 800),
              viewportFraction: 0.8,
              items: [
                Container(
                  margin: EdgeInsets.all(5.0),
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10.0),
                    image: DecorationImage(
                      image: NetworkImage(
                          "https://images.pexels.com/photos/2116475/pexels-photo-2116475.jpeg? 
     auto=compressamp;cs=tinysrgbamp;dpr=2amp;w=500"),
                      fit: BoxFit.cover,
                    ),
                  ),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                      Text(
                        'Usable Flower for Health',
                        style: TextStyle(
                          color: Colors.white,
                          fontWeight: FontWeight.bold,
                          fontSize: 18.0,
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.all(15.0),
                        child: Text(
                          'Lorem Ipsum is simply dummy text use for printing and type script',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 15.0,
                          ),
                          textAlign: TextAlign.center,
                                         ],
            ),
           ],
         ),
         )
         ] ,
        ),
       );
     }
    }

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

1. Какой у вас карусельный слайдер? Используете ли вы пакет carousel_slider? Вы говорите, что это ListView, но ListView не обладает всеми этими свойствами. Можете ли вы предоставить код CarouselSlider (хотя бы минимальный код) для воспроизведения?

2. Я использовал эту версию карусельного слайдера в файле pubsec.yaml: carousel_slider: ^ 1.4.1

Ответ №1:

Я думаю, что дополнительное пространство исходит из заполнения по умолчанию в ListView. Из документации здесь:

«По умолчанию ListView автоматически заполняет прокручиваемые края списка, чтобы избежать частичных препятствий, обозначенных заполнением MediaQuery. Чтобы избежать такого поведения, переопределите с помощью свойства заполнения нулем. «

Добавить:

 padding: EdgeInsets.all(0)

В вашем ListView виджете установите для него значение 0.

Я попробовал это с вашим примером кода, он правильно удаляет лишнее пространство.