首页 > 解决方案 > 颤振:图像丢失在 SliverAppBar

问题描述

我正在使用SliverAppBar

以前我有 2 页让我们说(搜索和详细信息),

详细信息页面中,我有问题当我向下滚动并使图像不可见之后,我按下按钮返回,我的图像在搜索页面中丢失。但是,如果我向下滚动然后向上滚动以使图像可见,然后我按下后退按钮,我的图像不会丢失并且仍然留在那里。

这可能令人困惑,但您可以查看GIF以了解更多详细信息。 SliverAppBar 图片

你能帮我解决这个问题吗?

谢谢

这是 Detail.dart :

import 'package:flutter/material.dart';
import 'package:flutter_news/model/Berita_model.dart';
import 'package:flutter_news/widget/Widget_builder.dart';

class WartawanDetail extends StatefulWidget {
  final int idWartawan;
  final String gambarWartawan;
  final String namaWartawan;
  WartawanDetail({this.idWartawan, this.gambarWartawan, this.namaWartawan});
  @override
  _WartawanDetailState createState() => _WartawanDetailState();
}

class _WartawanDetailState extends State<WartawanDetail> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            floating: true,
            pinned: false,
            leading: IconButton(
              icon: Icon(Icons.arrow_left),
              onPressed: () => Navigator.pop(context),
            ),
            expandedHeight: 300.0,
            centerTitle: true,
            flexibleSpace: FlexibleSpaceBar(
              background: Hero(
                tag: widget.idWartawan,
                child: Container(
                  decoration: BoxDecoration(
                    image: DecorationImage(
                        image: AssetImage(widget.gambarWartawan),
                        fit: BoxFit.cover),
                  ),
                  child: Stack(
                    children: <Widget>[
                      Positioned(
                        bottom: 10,
                        left: 10,
                        child: Material(
                          color: Colors.transparent,
                          child: Chip(
                            backgroundColor: Colors.blue,
                            labelStyle: TextStyle(color: Colors.white),
                            label: Text(widget.namaWartawan),
                          ),
                        ),
                      ),
                      Positioned(
                        bottom: 10,
                        right: 10,
                        child: Material(
                          color: Colors.transparent,
                          child: Chip(
                            backgroundColor: Colors.blue,
                            labelStyle: TextStyle(color: Colors.white),
                            label: Text("2 Berita"),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            actions: <Widget>[
              IconButton(
                icon: Icon(Icons.more_horiz),
                onPressed: () => "",
              ),
            ],
          ),
          SliverFixedExtentList(
            itemExtent: MediaQuery.of(context).size.height,
            delegate: SliverChildListDelegate(
              [
                Container(
                  padding: EdgeInsets.all(8),
                  child: ListView.builder(
                      shrinkWrap: true,
                      physics: NeverScrollableScrollPhysics(),
                      itemCount: beritas.length,
                      itemBuilder: newsBuilderHome),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }
}

这是我的搜索.dart

Widget wartawanBuilderSearch(BuildContext context, int index) {
  ThemeData localTheme = Theme.of(context);
  return Container(
    margin: EdgeInsets.all(8),
    child: Column(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: <Widget>[
        Expanded(
          child: Container(
            child: Hero(
              tag: wartawans[index].idWartawan,
              child: Material(
                color: Colors.transparent,
                child: InkWell(
                  onTap: () => Navigator.push(
                    context,
                    PageTransition(
                      type: PageTransitionType.downToUp,
                      child: WartawanDetail(
                        idWartawan:wartawans[index].idWartawan,
                        gambarWartawan: wartawans[index].gambarWartawan,
                        namaWartawan: wartawans[index].namaWartawan,
                      ),
                    ),
                  ),
                  child: CircleAvatar(
                    backgroundColor: Colors.red,
                    radius: 50,
                    backgroundImage:
                        AssetImage(wartawans[index].gambarWartawan),
                  ),
                ),
              ),
            ),
          ),
        ),
        Container(
          child: Align(
            alignment: Alignment.bottomLeft,
            child: Text(
              wartawans[index].namaWartawan,
              style: localTheme.textTheme.caption
                  .copyWith(fontSize: 14, fontWeight: FontWeight.bold),
              overflow: TextOverflow.ellipsis,
            ),
          ),
        )
      ],
    ),
  );
}

标签: flutterdartflutter-sliver

解决方案


推荐阅读