Description:

adaptable screen

The plug-in scales sizes based on the size of the UIDesign prototypes and the windows the components are being placed into.

Getting started #
Depend on it
Add this to your package's pubspec.yaml file:
dependencies:
adaptable_screen: ^0.0.4
copied to clipboard
Install it
You can install packages from the command line:
with Flutter:
$ flutter pub get
copied to clipboard
Usage #
To set the widths and heights based on the build size of your design, use the AdaptableScreenUtils.init function to set the sizes. Essa função deve ser utilizada ao iniciar a construção do seu aplicativo.
void main() {
AdaptableScreenUtils.init(
heightUIDisign: 1000,
widthUIDisign: 956,
);
runApp(const MyApp());
}
copied to clipboard
Use .h to scale the height based on the window size:
Container(
height: 10.h
)
copied to clipboard
Use .w to scale the width based on the window size:
Container(
width: 10.w
)
copied to clipboard
Use .ssp to scale text based on window size, this function can change font size as window changes size:
Text(
"Text Exemplo",
style: TextStyle(fontSize: 15.ssp),
)
copied to clipboard
Use .sp to scale text based on window size:
Text(
"Text Exemplo",
style: TextStyle(fontSize: 15.ssp),
)
copied to clipboard
Use .r to scale radius based on minimum window size:
Container(
decoration: BoxDecoration(
color: Colors.grey,
borderRadius: BorderRadius.circular(10.r),
),
height: 50.h,
width: 100.w,
child: Center(
child: Text(
"Text Exemplo",
style: TextStyle(fontSize: 15.sp),
),
),
)
copied to clipboard
If you want to see a usage in a simple way, go to /example folder.
Additional information #
For contributes:

Fork this repository;
Create a new branch to develop your feature: git checkout -b my-feature;
Commit your changes: git commit -m 'feat: my new feature';
Push to your branch: git push origin my-feature.
Open a pull request for your code to be evaluated.

To help maintain the chosen pattern we also create a file which is called before every commit. This file will format and pinpoint (if present) errors in the codestyle of your code. To enable this you must first copy it to git's hooks folder. If you are developing on macOS, go to the root of the project and run the command below:
cp pre-commit .git/hooks/pre-commit
copied to clipboard
After this step, it is necessary to give permission for the file to be executed. Just follow the following command:
chmod +x .git/hooks/pre-commit
copied to clipboard

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Share

• Share on Facebook
• Share on Twitter