responsive_container 0.0.1 responsive_container: ^0.0.1 copied to clipboard
Use percentage for width and height values.
Responsive Container #
Use percentage for width and height values in any Widget
Getting Started #
- Add the dependency to your "pubspec.yaml" file.
dependencies:
flutter:
sdk: flutter
responsive_container:
- Import package into your code
//...
import 'package:responsive_container/responsive_container.dart';
//...
Usage #
- You can set the widget height and width percentages from 0 to 100 (double)
ResponsiveContainer(
heightPercent: 50.0, //value percent of screen total height
widthPercent: 50.0, //value percent of screen total width
child: Container(color: Colors.red,), //any widget
)
Full exemple #
import 'package:flutter/material.dart';
import 'package:responsive_container/responsive_container.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text("Responsive Container"),),
body: Center(
child: ResponsiveContainer(
heightPercent: 50.0, //value percent of screen total height
widthPercent: 50.0, //value percent of screen total width
child: Container(color: Colors.red,), //any widget
)
),
)
);
}
}
About me #
- Jacob Moura jacobaraujo7@gmail.com
For news on the world Flutter -> flutterando.com.br.
For help getting started with Flutter, view our online documentation.
For help on editing package code, view the documentation.