dancamdev / effectively_scale_ui_according_to_different_screen_sizes Goto Github PK

I'm fairly new to flutter and not that experienced - I want to be able to use this for my theme, particularly with regard to my Text Theme. It's in a separate file. There is nowhere at the top of the theme file to add "SizeConfig().init(context)," so I am getting flutter tester errors. also - do i need to put anything into my main.dart, even if it never really appears in the multi-screen app? I hope you can help, thank you!

Error:

======== Exception caught by widgets library =======================================================
The following NoSuchMethodError was thrown building MyApp(dirty, state: _MyAppState#7175d):
The method '*' was called on null.
Receiver: null
Tried calling: *(6)

The relevant error-causing widget was:
MyApp file:///......./lib/main.dart:9:10
When the exception was thrown, this was the stack:
#0 Object.noSuchMethod (dart:core-patch/object_patch.dart:54:5)
#1 _mmTextTheme (package:meeting_maker/utils/themes.dart:129:52)
#2 mmLite (package:meeting_maker/utils/themes.dart:85:16)
#3 _MyAppState.build (package:meeting_maker/main.dart:39:14)
#4 StatefulElement.build (package:flutter/src/widgets/framework.dart:4691:27)

Here is part of my theme file which shows the issue perhaps...

TextTheme _mmTextTheme(TextTheme base) {
return base
.copyWith(
headline1: base.headline1.copyWith(
color: mmMidBlue,
fontWeight: FontWeight.w300,
fontSize: 30,
letterSpacing: -1.0,
),
headline2: base.headline2.copyWith(
color: mmDarkBlue,
fontWeight: FontWeight.w800,
fontSize: 30,
letterSpacing: -1.0,
),
headline3: base.headline3.copyWith(
color: mmMidBlue,
fontWeight: FontWeight.w300,
fontSize: SizeConfig.safeBlockHorizontal * 6,
letterSpacing: -1.0,
),
headline4: base.headline4.copyWith(
color: mmDarkBlue,
fontWeight: FontWeight.w800,
fontSize: SizeConfig.safeBlockHorizontal * 6,
letterSpacing: -1.0,

hi, can I ask what is 100?
blockSizeHorizontal = screenWidth / 100;

Works only if Scaffold is parent/root

class NextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        height: SizeConfig.blockSizeVertical * 50, //occupy 50% of screen
        width: SizeConfig.blockSizeHorizontal * 25, //occupy 25% of screen
        color: Colors.red,
      ),
    );
  }
}

Doesn't work Other Widget is Parent/Root

class NextPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      height: SizeConfig.blockSizeVertical * 50, //occupy 50% of screen
      width: SizeConfig.blockSizeHorizontal * 25, //occupy 25% of screen
      color: Colors.red,
    );
  }
}

Is this expected?
Is there any other widget apart from Scaffold where this works

In your main.dart, If Center is removed from build() method of _MyHomePageState, UI is not rendering after status bar in Android. It is also covering status bar. Then, what is the use of safeBlockVertical and safeBlockHorizontal

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    SizeConfig().init(context);
    return Scaffold(
      body: Container(
        height: SizeConfig.safeBlockVertical * 25,
        width: SizeConfig.safeBlockHorizontal * 55,
        color: Colors.black,
      ),
    );
  }
}

Instead I had to wrap inside SafeArea, and use blockSizeVertical, blockSizeHorizontal to make it work

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    SizeConfig().init(context);
    return Scaffold(
      body: SafeArea(
        child: Container(
          height: SizeConfig.blockSizeVertical * 25,
          width: SizeConfig.blockSizeHorizontal * 55,
          color: Colors.black,
        ),
      ),
    );
  }
}