FilledStacks / provider_architecture

A set of widgets to help with the implementation of the Provider architecture as shown by FilledStacks
86 stars 15 forks source link

Using provider_architecture with responsive_builder #11

Closed SilenceCodder closed 4 years ago

SilenceCodder commented 4 years ago

First of all, I really appreciate your amazing plugin both the responsive_builder and provider_architecture. It really saves my days and headache of separation of concerns THANKS.

Am trying to use provider_architecture along with reponseive_builder. Am currently trying it for Mobile Orientation(Landscape and portrait). The Portrait works but when I rotate the device the Landscape it doesn't change the UI(as expected). I even try to add Watch and Tablet yet still the same. have try to use ViewModelProvider<LoginViewModel>.withoutConsumer and ViewModelProvider<LoginViewModel>.withConsumer Here is my code

 @override
  Widget build(BuildContext context) {
    return ViewModelProvider<LoginViewModel>.withConsumer(
      viewModel: LoginViewModel(),
      builder: (context, model, child) => 
      ResponsiveBuilder(
      builder:  (context, sizingInformation){
          if (sizingInformation.deviceScreenType == DeviceScreenType.Tablet) {
            return Container(color: Colors.red,);
          }

          if (sizingInformation.deviceScreenType == DeviceScreenType.Mobile) {

                return OrientationLayoutBuilder(
              portrait: (context) => Container(color: Colors.amber,),
              landscape: (context) => LoginViewLandscape(),
                );

          }if (sizingInformation.deviceScreenType == DeviceScreenType.Watch) {
            return Container(color: Colors.black,);
          }

          return Container(color:Colors.purple);
      }
      ));
  }

What can be wrong here?

FilledStacks commented 4 years ago

Hi there,

Thank you for the kind words.

You can use the ScreenTypeLayout to supply the tablet, mobile, watch versions instead of the responsive builder. It’s based on the ResponsiveBuilder so it should be the same but you never know.

Try using the ScreenTypeLayout, it’s called that I think. Then supply your different screen sizes to it and see if it works.

Also, when orientating a device now you have to press that little button that pops up by the soft back buttons ton perform the actual rotation on an android device. From: Harbdollarmailto:notifications@github.com Sent: Wednesday, 29 January 2020 04:02 To: FilledStacks/provider_architecturemailto:provider_architecture@noreply.github.com Cc: Subscribedmailto:subscribed@noreply.github.com Subject: [FilledStacks/provider_architecture] Using provider_architecture with responsive_builder (#11)

First of all, I really appreciate your amazing plugin both the responsive_builder and provider_architecture. It really saves my days and headache of separation of concerns THANKS.

Am trying to use provider_architecture along with reponseive_builder. Am currently trying it for Mobile Orientation(Landscape and portrait). The Portrait works but when I rotate the device the Landscape it doesn't change the UI(as expected). I even try to add Watch and Tablet yet still the same. have try to use ViewModelProvider.withoutConsumer and ViewModelProvider.withConsumer Here is my code

@override

Widget build(BuildContext context) {

return ViewModelProvider<LoginViewModel>.withConsumer(

  viewModel: LoginViewModel(),

  builder: (context, model, child) =>

  ResponsiveBuilder(

  builder:  (context, sizingInformation){

      if (sizingInformation.deviceScreenType == DeviceScreenType.Tablet) {

        return Container(color: Colors.red,);

      }

      if (sizingInformation.deviceScreenType == DeviceScreenType.Mobile) {

            return OrientationLayoutBuilder(

          portrait: (context) => Container(color: Colors.amber,),

          landscape: (context) => LoginViewLandscape(),

            );

      }if (sizingInformation.deviceScreenType == DeviceScreenType.Watch) {

        return Container(color: Colors.black,);

      }

      return Container(color:Colors.purple);

  }

  ));

}

What can be wrong here?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHubhttps://github.com/FilledStacks/provider_architecture/issues/11?email_source=notifications&email_token=AA3M72QGVO4X6KURFLEWS3LRADPSFA5CNFSM4KM5L7C2YY3PNVWWK3TUL52HS4DFUVEXG43VMWVGG33NNVSW45C7NFSM4IJM6I2Q, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AA3M72VGB5HWQEUZOMO4WH3RADPSFANCNFSM4KM5L7CQ.

SilenceCodder commented 4 years ago

Oh! Thanks. I really appreciate your quick response. Nothing is wrong with responsive_builder and provider_architecture.. The Error came from device_preview because I used it for testing the Orientation. Have successfully remove it and responsive_builder work perfectly as expected.

By the way, Hope Am still on the line to use ViewModelProvider<LoginViewModel>.withoutConsumer and ViewModelProvider<LoginViewModel>.withConsumer for ScreenType and Orientation senerio.

THANKS.

FilledStacks commented 4 years ago

Yes, you should be able to use both of those with any responsive builder package. They'll work with or without any library.

Happy to hear it's working.

SilenceCodder commented 4 years ago

Thanks, Man. I hope you can do a video tutorial on a complex App using those plugins apart from your recent tutorial(CRUD in Firestore).

Looking forward to your tutorials.

THANKS