res_builder 1.1.2 res_builder: ^1.1.2 copied to clipboard
A Flutter Widget for building responsive UI by providing different layouts for different screen sizes.
A Flutter Widget for building responsive UI.
Features #
Responsive()
: Define three types of widgets which are automatically chosen based on the screen width.Responsive.builder()
: Define builder methods to build the widgets.Responsive.withShared<T>()
: Define are shared child which can be any type and will be shared between all the layouts.Responsive.value<T>()
: Define a simple value which is responsively chosen.- To customize the layout behavior, you may override the
upperBound
and/orlowerBound
static properties as well as theisMobile
,isDesktop
andisTablet
static methods.
Getting started #
- Import the package:
import 'package:res_builder/responsive.dart
;
Usage #
import 'package:res_builder/responsive.dart';
...
MaterialApp(
title: '''
Responsive Demo on
${Responsive.value<String>(
context: context,
onMobile: 'Mobile',
onTablet: 'Tablet',
onDesktop: 'Desktop',
)}
''',
home: Scaffold(
body: Responsive.withShared<List<Widget>>(
share: [
const Text("Responsive Layout"),
Responsive(
onMobile: const Text("Im inside of a Column"),
onDesktop: const Text("Im inside of a Row"),
),
],
onMobile: (context, children) => Column(
children: children,
),
onDesktop: (context, children) => Row(
children: children,
),
),
),
);
Additional information #
Don't hesitate to contact me if you have questions or ideas.