Git Product home page Git Product logo

Comments (6)

rayliverified avatar rayliverified commented on May 27, 2024 2

You're right, the initial frame 0 width and height issue is still present in the Flutter framework.

Let me read through the issues and see how people want to solve this.
So far, the v0.2.0 solution was an empty container with a configurable color.

Solution 1: Empty container
Complaints: Black, flickering.
Solution 2: Empty container with configurable color

We're currently at Solution 2.
I'll add Solution 2 back after doing some investigation into if it's compatible with initial loading screens / indicators.

from responsiveframework.

rayliverified avatar rayliverified commented on May 27, 2024 1

Thank you for reporting with the info.
This could be the null size on initial frame issue.
MediaQuery return null on the initial frame which makes layouts that rely on it not work on the first frame.

from responsiveframework.

pulsafi avatar pulsafi commented on May 27, 2024

Hello, has this been resolved? @jlin5 were you able to figure something out? I'm having the same problem :/

from responsiveframework.

jesus-villalobos avatar jesus-villalobos commented on May 27, 2024

Same problem here :( Any fixes or temporary work around to address that initial null value? @jlin5 @rayliverified I really want to use this framework in my new app. Thank you 🙏🏽

from responsiveframework.

jlin5 avatar jlin5 commented on May 27, 2024

@pulsafi @jesus-villalobos @rayliverified

I'm not sure what happened but the screen doesn't change suddenly anymore when I run the sample code. The breakpoint value is still null though on initial build. I noticed that in version 0.2.0, there was a conditional that would return an empty background if the screenWidth is 0.

@override
Widget build(BuildContext context) {
// Platform initialization requires context.
setPlatform();
// Initialization check. Window measurements not available until postFrameCallback.
// Return first frame with empty background.
if (screenWidth == 0) {
return buildBackground(
background: widget.background, color: widget.backgroundColor);
}
return InheritedResponsiveWrapper(

The fix would be to add a similar conditional before InheritedResponsiveBreakpoints in the latest version.

    // Initialization check. Window measurements not available until postFrameCallback.
    // Return first frame with empty widget.
    if (screenWidth == 0) {
      return Container();
    }

@override
Widget build(BuildContext context) {
// Platform initialization requires context.
setPlatform();
return InheritedResponsiveBreakpoints(
data: ResponsiveBreakpointsData.fromWidgetState(this),
child: widget.child,
);
}
}

from responsiveframework.

jesus-villalobos avatar jesus-villalobos commented on May 27, 2024

Thank you for looking into this @jlin5 🙏🏽 From my understanding, though, there is nothing that I can do on my end to catch this Null? Should I just add a check for if screenSize is Null? Or would we just have to wait until @rayliverified gets around to addressing this? Thanks :)

from responsiveframework.

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.