flexify 2.1.1 copy "flexify: ^2.1.1" to clipboard
flexify: ^2.1.1 copied to clipboard

Flexify is a Flutter package for responsive design and simplified navigation. Easily adapt interfaces to any screen size and smooth page transitions with customizable animations.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:flexify/flexify.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    //Wrap your app with Flexify for initialize
    return const Flexify(
      designWidth: 375,
      designHeight: 812,
      app: MaterialApp(
        home: ExampleScreen(),
      ),
    );
  }
}

class ExampleScreen extends StatelessWidget {
  const ExampleScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Container(
              width: 250.rw, //responsive width
              height: 250.rh, //responsive height
              decoration: BoxDecoration(
                color: Colors.blue,
                borderRadius: BorderRadius.circular(25.rs), // responsive size
              ),
              child: Center(
                child: Text(
                  'This is a Responsive Text',
                  style: TextStyle(
                    fontSize: 22.rt,
                    fontWeight: FontWeight.w700,
                  ),
                ),
              ),
            ),
            20.verticalSpace, // SizedBox(height:20.rh) responsive vertical space
            20.horizontalSpace, // SizedBox(width: 20.rw) responsive horizontal space

            /*

           - Easy Navigations with Animations

           - Alternative of Navigator.push

             Flexify.go(
              NewScreen(),
              animation: FlexifyRouteAnimations.fade,
              duration: Duration(milliseconds: 500));


            - Alternative of Navigator.pushReplacement
            
             Flexify.goRemove(
              NewScreen(),
              animation: FlexifyRouteAnimations.slide,
              duration: Duration(milliseconds: 500));


            - Alternative of Navigator.pushAndRemoveUntil

             Flexify.goRemoveAll(
               NewScreen(),
               animation: FlexifyRouteAnimations.scale,
               duration: Duration(milliseconds: 500));


            - Alternative of Navigator.pop
             Flexify.back();




           - Available Animations

            FlexifyRouteAnimations.fade
            FlexifyRouteAnimations.slide
            FlexifyRouteAnimations.scale
            FlexifyRouteAnimations.rotate
            FlexifyRouteAnimations.zoom
            FlexifyRouteAnimations.size
            FlexifyRouteAnimations.elastic
            FlexifyRouteAnimations.flip,
            FlexifyRouteAnimations.slideFromBottom,
            FlexifyRouteAnimations.customFadeScale,
            FlexifyRouteAnimations.blur,
            FlexifyRouteAnimations.slideAndFade,
            FlexifyRouteAnimations.rotateAndScale,
            FlexifyRouteAnimations.flipAndFade,
            
            */
          ],
        ),
      ),
    );
  }
}
43
likes
160
points
113
downloads

Publisher

unverified uploader

Weekly Downloads

Flexify is a Flutter package for responsive design and simplified navigation. Easily adapt interfaces to any screen size and smooth page transitions with customizable animations.

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

Apache-2.0 (license)

Dependencies

flutter

More

Packages that depend on flexify