Giter Club home page Giter Club logo

Comments (5)

dalebulmer avatar dalebulmer commented on July 16, 2024 2

I have the same issue - sample code to recreate the issue follows. The issues occurs when the first render of the widget has 2 columns and it is dynamically changed to 1 column.

`import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';

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

class MyApp extends StatefulWidget {
  static const String _title = 'Flutter Code Sample';

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: MyApp._title,
      home: MyStatelessWidget(),
    );
  }
}

/// This is the stateless widget that the main application instantiates.
class MyStatelessWidget extends StatefulWidget {
  MyStatelessWidget({Key key}) : super(key: key);

  @override
  _MyStatelessWidgetState createState() => _MyStatelessWidgetState();
}

class _MyStatelessWidgetState extends State<MyStatelessWidget> {
  bool isMosaic=false;
//  bool isMosaic=true;  (UNCOMMENT THIS - if this starts out as TRUE it will work fine)

  @override
  Widget build(BuildContext context) {
    return Scaffold(

      body:
      CustomScrollView(
          physics: AlwaysScrollableScrollPhysics(),

          slivers: <Widget>[
       SliverStaggeredGrid.countBuilder(
      crossAxisCount: isMosaic ? 2 : 1,
      itemCount: 10,
      staggeredTileBuilder: (index) => StaggeredTile.fit(1),
    mainAxisSpacing: isMosaic ? 2.0 : 0.0,
    crossAxisSpacing: 2.0,
    itemBuilder: (context, index) {
    return SizedBox(
    height: (!isMosaic ? 350 : index.isEven ? 380 : 320),
    width: 200,
    child: Container (
      color: Colors.grey,
    child: Text(index.toString(), textAlign: TextAlign.center, textScaleFactor: 4.0,)
      ));
    }
    )]),

      floatingActionButton: FloatingActionButton(
        onPressed: changeIt,

        child: Icon(Icons.shuffle),

      ),
    );
  }

  void changeIt () {
    setState(() {
      isMosaic = !isMosaic;
    });
  }
}

I have a workaround consists in editing silver_staggered_grid.dart @ 285

Replace:
if (viewportOffsets.isEmpty) {

with:

if (true) { //viewportOffsets.isEmpty) {

from flutter_staggered_grid_view.

skatzbizarro avatar skatzbizarro commented on July 16, 2024

I have the same question, when I change crossAxisCount it will give me that weird effect of loosing a column or adding a new empty one

from flutter_staggered_grid_view.

MuhammadEhsanMirzaei avatar MuhammadEhsanMirzaei commented on July 16, 2024

Hi, I have same problem in chrome(flutter web) and I tried version 0.3.0 and 0.3.1

from flutter_staggered_grid_view.

letsar avatar letsar commented on July 16, 2024

Can you test with the latest 0.5.0 preview? https://pub.dev/packages/flutter_staggered_grid_view/versions/0.5.0-dev.1

from flutter_staggered_grid_view.

letsar avatar letsar commented on July 16, 2024

This thread has been closed since there has not been any response for a while. If you are still experiencing a similar issue, please open a new bug.

from flutter_staggered_grid_view.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.