Прокрутка предела просмотра списка флаттера - PullRequest
Новая
       7

Прокрутка предела просмотра списка флаттера

0 голосов
/ 20 мая 2019

Я занимаюсь разработкой приложения для флаттера. Я использую ListView для прокрутки. Мне нужна горизонтальная прокрутка. Ширина прокручиваемых слайдов составляет 75% от ширины экрана. У меня шесть слайдов, первые три цвета слайдов: красный, фиолетовый, янтарный. Когда я прокручиваю первый слайд красный. Он покажет вторую половину слайда. Это означает, что ширина прокрутки составляет 100%. Я хочу показать каждый слайд завершен при прокрутке. Если я прокручиваю красным, я хочу показать фиолетовый завершенным. 

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
    return MaterialApp(
    title: 'MyApp',
    home: MainPage(),
    );
}
}

class MainPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
    return Scaffold(
    body: Container(
        height: MediaQuery.of(context).size.width/1.5,
        margin: EdgeInsets.symmetric(vertical: 50.0),
        child: LayoutBuilder(builder: (context, snapshot) {
        final width = MediaQuery.of(context).size.width / 1.5; 
        return ListView(
            itemExtent: width,
            physics: const PageScrollPhysics(), 
            scrollDirection: Axis.horizontal,
            children: [
            Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.redAccent,),
            Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.purpleAccent,),
            Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.amberAccent,),
            Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.blueAccent,),
            Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.pinkAccent,),
            Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.greenAccent,)
            ],
        );
        }),
    ),
    );
}
}

Текущий скриншот прокрутки

screenshot 1

screenshot

1 Ответ

0 голосов
/ 22 мая 2019

Я использовал PageView вместо ListView

PageView(children: <Widget>[ 
ListView(itemExtent: width, 
// physics: const PageScrollPhysics(),     
scrollDirection: Axis.horizontal, 
children: [ Container(
margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.redAccent,), 
  Container(margin: EdgeInsets.symmetric(horizontal: 10.0),color: Colors.purpleAccent,), 
  Container(margin: EdgeInsets.symmetric(horizontal: 10.0), color: Colors.amberAccent,),
 ], 
), ], );
...