1. styled_widget

Styled_widget is built as a tool to enhance your Flutter development experience and integrate seamlessly with your code base.

Code examples:

Icon(OMIcons.home, color: Colors.white)
  .padding(all: 10)
  .decorated(color: Color(0xff7AC1E7), shape: BoxShape.circle)
  .padding(all: 15)
  .decorated(color: Color(0xffE8F2F7), shape: BoxShape.circle)
  .padding(all: 20)
  .card(
    elevation: 10,
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(20),
    ),
  )
  .alignment(Alignment.center)
  .backgroundColor(Color(0xffEBECF1));
Copy the code

Showcase :

Making: pub. Dev/packages/st…

2.flui

A powerful Google Flutter UI framework with Code Sample:

FLAppBarTitle(
    title: 'AppBar',
    subtitle: '(subtitle)',
    layout: FLAppBarTitleLayout.vertical,
    showLoading: true
)
Copy the code

Making: pub. Dev/packages/fl…

3.flutter_screenutil

A Plugin for Flutter that ADAPTS to screen and font sizes. Let your UI display reasonable layout on different screen sizes!

ScreenUtilInit(
      designSize: Size(360.690),
      builder: () => MaterialApp(
        ...
        theme: ThemeData(
             primarySwatch: Colors.blue,
             textTheme: TextTheme(
                  button: TextStyle(fontSize: 45.sp)
              ),
         ),
      ),
    )
Copy the code

Making: pub. Dev/packages/fl…

4.responsive_framework

A responsive framework automatically ADAPTS your UI to different screen sizes. Create your UI in one go and have it display perfectly in pixels on mobile devices, tablets, and desktops!

MaterialApp(
      builder: (context, widget) => ResponsiveWrapper.builder(
          child,
          maxWidth: 1200,
          minWidth: 480,
          defaultScale: true,
          breakpoints: [
            ResponsiveBreakpoint.resize(480, name: MOBILE),
            ResponsiveBreakpoint.autoScale(800, name: TABLET),
            ResponsiveBreakpoint.resize(1000, name: DESKTOP),
          ],
          background: Container(color: Color(0xFFF5F5F5))),
      initialRoute: "/".)Copy the code

Making: pub. Dev/packages/re…

5.flutter_neumorphic

A complete, usable Neumorphic UI kit for Flutter

Neumorphic(
  style: NeumorphicStyle(
    shape: NeumorphicShape.concave,
    boxShape: NeumorphicBoxShape.roundRect(BorderRadius.circular(12)), 
    depth: 8,
    lightSource: LightSource.topLeft,
    color: Colors.grey
  ),
  child: ...
)
Copy the code

Making: pub. Dev/packages/fl…

Original text: medium.com/flutter-com…

Author: Mirsaid I Smailov