flutter_sizer 1.0.1 flutter_sizer: ^1.0.1 copied to clipboard
Flutter Sizer helps implement a reponsive layout by providing helper widgets and extensions.
import 'package:flutter/material.dart';
import 'package:flutter_sizer/flutter_sizer.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return FlutterSizer(
builder: (context, orientation, screenType) {
return MaterialApp(
title: 'Flutter Sizer Example',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: Home(),
);
},
);
}
}
class Home extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
Container(
height: Adaptive.h(12.5), // or 12.5.h
width: 50.w, // or Adaptive.w(50)
color: Colors.black,
),
Text(
"This text is responsive",
style: TextStyle(fontSize: 12.sp), // or Adaptive.sp(12)
),
Device.orientation == Orientation.portrait
? Text("My Orientation is Portrait")
: Text("My Orientation is Landscape"),
Device.screenType == ScreenType.tablet
? Text("My Screen's Type is a Tablet")
: Text("My Screen's Type is a Phone")
],
),
);
}
}