WedX - журнал о программировании и компьютерных науках

создать настраиваемый слайдер заставки во флаттере

мне нужно создать что-то вроде этого такой вводный слайдер

Я использую плагин intro slider от flutter, но он не поддерживает 2 изображения, которые я пробовал

 slides.add(
      new Slide(
        pathImage: 'assets/logo_1.png',
        description:
            "Find trusted help for everything on your to-do-list.",
        styleDescription: TextStyle(
          color: Colors.black,
          fontSize: 18.0,
        ),
        marginDescription: EdgeInsets.only(top: 10.0),
        backgroundImage: "assets/ss4.jpg",
        backgroundOpacity: 0.0,
      ),
    );

 IntroSlider(
              slides: this.slides,
              colorActiveDot: Color(0xFF17b01b),
              sizeDot: 10.0,
              isShowSkipBtn: false,
              styleNameDoneBtn: TextStyle(
                color: Color(0xFF17b01b),
                fontSize: 15.0,
                fontWeight: FontWeight.bold,
              ),
              nameDoneBtn: 'Got it >',
              nameNextBtn: 'Got it >',
                  onDonePress:this.onDonePress ,
            )),

Вступительный слайдер поддерживает два изображения, но второе изображение предназначено для фонового изображения, поэтому мое изображение занимает весь фон экрана во вступительном слайдере, как я могу установить второе изображение в центре, как на изображении, которое я прикрепил? или как я могу указать высоту и ширину фоновому изображению во вводном слайдере ??

flutter flutter-layout
24.12.2019

  • Можете ли вы добавить оба изображения для слайдера. 24.12.2019
  • обратите внимание, что для backgroundOpacity установлено значение 0, поэтому фоновое изображение отображаться не будет. 24.12.2019

Ответы:


1

Как объяснено в документации подключаемого модуля, https://pub.dev/packages/intro_slider вы можете установить изображение высота и ширина такие:

new Slide(
        pathImage: 'assets/logo_1.png',
        // Added the next 3 lines
        heightImage: 500,
        widthImage: 300,
        foregroundImageFit: BoxFit.contain,
        description:
            "Find trusted help for everything on your to-do-list.",
        styleDescription: TextStyle(
          color: Colors.black,
          fontSize: 18.0,
        ),
        marginDescription: EdgeInsets.only(top: 10.0),
        backgroundImage: "assets/ss4.jpg",
        backgroundOpacity: 0.0,
      ),

Изменить

Извините, я неправильно понял вопрос.

Вы можете поместить любой виджет custon в свойство centerWidget следующим образом:

new Slide(
        centerWidget: Column(
            shrinkWrap: true,
            children: <Widget>[
                Text("image1 placeholder"),
                Text("some text"),
                Text("image2 placeholder"),
            ],
        ),
        backgroundImage: "assets/ss4.jpg",
        backgroundOpacity: 0.0,
      ),
24.12.2019
  • это изображение не может быть установлено так, как я хочу, в загруженном изображении @Zvi Karp 24.12.2019
  • @urvashi извините, я неправильно понял вопрос, обновил ответ. 24.12.2019
    • Новые материалы
    Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что это выглядит сложно…
    Просто начните и учитесь самостоятельно Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что он кажется мне сложным, и я бросил его. Это в основном инструмент..
    Лицензии с открытым исходным кодом: руководство для разработчиков и создателей
    В динамичном мире разработки программного обеспечения открытый исходный код стал мощной парадигмой, способствующей сотрудничеству, инновациям и прогрессу, движимому сообществом. В основе..
    Объяснение документов 02: BERT
    BERT представил двухступенчатую структуру обучения: предварительное обучение и тонкая настройка. Во время предварительного обучения модель обучается на неразмеченных данных с помощью..
    Как проанализировать работу вашего классификатора?
    Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..
    Работа с цепями Маркова, часть 4 (Машинное обучение)
    Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..
    Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]
    Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..
    Использование машинного обучения и Python для классификации 1000 сезонов новичков MLB Hitter
    Чему может научиться машина, глядя на сезоны новичков 1000 игроков MLB? Это то, что исследует это приложение. В этом процессе мы будем использовать неконтролируемое обучение, чтобы..
    Для любых предложений по сайту: [email protected]