Flutter 解答StackOverflow問題Page value is only available after content dimensions are established

2020-10-06 15:00:39

參考外掛carousel_slider

https://pub.flutter-io.cn/packages/carousel_slider/example

得到的結果:

import 'package:carousel_slider/carousel_options.dart';
import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Container(
        child: CarouselSlider(
          options: CarouselOptions(
            autoPlay: true,
            enlargeCenterPage: true,
            autoPlayCurve: Curves.easeInOut,
            aspectRatio: 16 / 9,
            viewportFraction: 0.75,
          ),
          items: [
            "https://firebasestorage.googleapis.com/v0/b/san-67ce2.appspot.com/o/clothes.jpeg?alt=media&token=d3be6bcb-4a40-4c78-a577-0b4f6a386536",
            "https://firebasestorage.googleapis.com/v0/b/san-67ce2.appspot.com/o/clothes.jpeg?alt=media&token=d3be6bcb-4a40-4c78-a577-0b4f6a386536",
            "https://firebasestorage.googleapis.com/v0/b/san-67ce2.appspot.com/o/clothes.jpeg?alt=media&token=d3be6bcb-4a40-4c78-a577-0b4f6a386536",
            "https://firebasestorage.googleapis.com/v0/b/san-67ce2.appspot.com/o/clothes.jpeg?alt=media&token=d3be6bcb-4a40-4c78-a577-0b4f6a386536",
            "https://firebasestorage.googleapis.com/v0/b/san-67ce2.appspot.com/o/clothes.jpeg?alt=media&token=d3be6bcb-4a40-4c78-a577-0b4f6a386536",
          ].map((i) {
            return Builder(
              builder: (BuildContext context) {
                return Padding(
                  padding: const EdgeInsets.all(2.0),
                  child: Container(
                      width: MediaQuery.of(context).size.width,
                      margin: EdgeInsets.symmetric(horizontal: 5.0),
                      decoration: BoxDecoration(
                          color: Colors.white,
                          border: Border.all(color: Colors.black)),
                      child: Image.network(
                        i,
                        fit: BoxFit.fill,
                        alignment: Alignment.center,
                      )),
                );
              },
            );
          }).toList(),
        ),
      ),
    );
  }
}

下載資源flutter_available_content