Flutter: sliverAppBar ridimensionare questione nella lista di scorrimento

voti
0

Voglio fare sliverAppBar ridimensionata durante lo scorrimento lista di sotto di essa.

Ora ci sono due problemi:

1) sliverAppBar non ridimensiona mentre sto lista a scorrimento ( screenshot )

2) Non riesco a trovare esempio / soluzione come ridimensionare il contenuto figlio di sliverAppBar quando si cambia l'altezza ( screenshot )

@override
Widget build(BuildContext context) {
  return Scaffold(
    backgroundColor: Colors.white,
    body: CustomScrollView(
      slivers: <Widget>[
        SliverAppBar( // <-- how to resize on scrolling ListView?
          expandedHeight: 200.0,
          floating: false,
          pinned: true,
          flexibleSpace: SafeArea(
            child: Column(
              children: [
                Row( // <-- how to make it flexible/resizable?
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.asset(
                      'assets/images/user.png',
                      fit: BoxFit.cover,
                      width: 120,
                    )
                  ],
                ),
              ],
            ),
          )
        ),
        SliverFillRemaining(
          child: ListView.builder(
            shrinkWrap: false,
            itemCount: widget.europeanCountries.length,
            itemBuilder: (context, index) {
              return ListTile(
                title: Text(widget.europeanCountries[index]),
              );
            },
          ),
        )
      ],
    ),
    floatingActionButton: FloatingActionButton(
      onPressed: _incrementCounter,
      tooltip: 'Increment',
      child: Icon(Icons.add),
    ), // This trailing comma makes auto-formatting nicer for build methods.
  );
}
È pubblicato 10/10/2019 alle 00:59
fonte dall'utente
In altre lingue...                            


1 risposte

voti
0

Usare [FlexibleSpaceBar] e [SliverList]

  • [SliverList] può cambiare la dimensione del [sliverAppBar] quando si scorre la lista
  • [FlexibleSpaceBar] impedisce troppopieno confine
import 'package:flutter/material.dart';

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

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

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  ScrollController controller = ScrollController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            expandedHeight: 200.0,
            floating: true,
            pinned: true,
            flexibleSpace: FlexibleSpaceBar( // 
              background: Column(
                children: [
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Placeholder(
                        fallbackHeight: 120,
                        fallbackWidth: 120,
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
          SliverList( //
            delegate: SliverChildBuilderDelegate(
              (context, index) {
                return ListTile(
                  title: Text("Text"),
                );
              },
              childCount: 100,
            ),
          ),
          // SliverFillRemaining(
          //   child: ListView.builder(
          //     shrinkWrap: false,
          //     itemCount: 100,
          //     itemBuilder:,
          //   ),
          // )
        ],
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}
Risposto il 10/10/2019 a 04:46
fonte dall'utente

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more