Flutter Next

Now build flutter apps with ease and responsive.

An advanced flutter package to build responsive application accross all platform with ease and has an handful of different types of extension.

Features

Develop Responsive Ui
Add animations with single line
Handful of extension

Usage/Examples

🔗 One Page

Appendix

Widgets
- Avatar
- Hover Widget
- BreadCumb
- Alerts
- Grid System
- Next Grid
- Container
- Accordion
- Button
Animations
Extensions
- Widget Extensions
- Context
- Padding
- String
- Bool
Shadows

Widgets

Avatar

NetworkImage( "https://images.ctfassets.net/hrltx12pl8hq/qGOnNvgfJIe2MytFdIcTQ/429dd7e2cb176f93bf9b21a8f89edc77/Images.jpg?fit=fill&w=175&h=175&fm=webp"))), Text( "Custom Avatar Group", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold), ), SizedBox( height: 15, ), NextAvatarGroup( backgroundColor: Colors.orange, itemCount: 6, widthFactor: 0.8, imagesList: List.generate( 10, (index) => NetworkImage( "https://images.ctfassets.net/hrltx12pl8hq/qGOnNvgfJIe2MytFdIcTQ/429dd7e2cb176f93bf9b21a8f89edc77/Images.jpg?fit=fill&w=175&h=175&fm=webp")), itemBuilder: (context, index, image) => Stack( children: [ Container( width: 50, height: 50, decoration: BoxDecoration( image: DecorationImage(image: image), border: Border.all(color: Colors.orange, width: 1.5), color: Colors.red, borderRadius: BorderRadius.circular(10)), ), if (index % 3 == 0) Positioned( bottom: 0, left: 0, child: CircleAvatar( backgroundColor: Colors.green, radius: 5, ), ) ], ), ), Text( "Avatar Group Limit count", style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold), ), SizedBox( height: 15, ), NextAvatarGroup( backgroundColor: Colors.orange, limitTo: 5, imagesList: List.generate( 10, (index) => NetworkImage( "https://images.ctfassets.net/hrltx12pl8hq/qGOnNvgfJIe2MytFdIcTQ/429dd7e2cb176f93bf9b21a8f89edc77/Images.jpg?fit=fill&w=175&h=175&fm=webp")), widthFactor: 0.5, )">

  Text(
    "Avatar Group",
    style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
  ),
  SizedBox(
    height: 15,
  ),
  NextAvatarGroup(
      backgroundColor: Colors.orange,
      imagesList: List.generate(
          6,
          (index) => NetworkImage(
              "https://images.ctfassets.net/hrltx12pl8hq/qGOnNvgfJIe2MytFdIcTQ/429dd7e2cb176f93bf9b21a8f89edc77/Images.jpg?fit=fill&w=175&h=175&fm=webp"))),
  Text(
    "Custom Avatar Group",
    style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
  ),
  SizedBox(
    height: 15,
  ),
  NextAvatarGroup(
    backgroundColor: Colors.orange,
    itemCount: 6,
    widthFactor: 0.8,
    imagesList: List.generate(
        10,
        (index) => NetworkImage(
            "https://images.ctfassets.net/hrltx12pl8hq/qGOnNvgfJIe2MytFdIcTQ/429dd7e2cb176f93bf9b21a8f89edc77/Images.jpg?fit=fill&w=175&h=175&fm=webp")),
    itemBuilder: (context, index, image) => Stack(
      children: [
        Container(
          width: 50,
          height: 50,
          decoration: BoxDecoration(
              image: DecorationImage(image: image),
              border: Border.all(color: Colors.orange, width: 1.5),
              color: Colors.red,
              borderRadius: BorderRadius.circular(10)),
        ),
        if (index % 3 == 0)
          Positioned(
            bottom: 0,
            left: 0,
            child: CircleAvatar(
              backgroundColor: Colors.green,
              radius: 5,
            ),
          )
      ],
    ),
  ),
      Text(
        "Avatar Group Limit count",
        style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold),
      ),
      SizedBox(
        height: 15,
      ),
      NextAvatarGroup(
        backgroundColor: Colors.orange,
        limitTo: 5,
        imagesList: List.generate(
            10,
            (index) => NetworkImage(
                "https://images.ctfassets.net/hrltx12pl8hq/qGOnNvgfJIe2MytFdIcTQ/429dd7e2cb176f93bf9b21a8f89edc77/Images.jpg?fit=fill&w=175&h=175&fm=webp")),
        widthFactor: 0.5,
      )

Hover Widget

Using this you can know whether widget is hovered or not. Even it works for mobile and every device.

Hover Duration - Duration for returning from hover to normal state

  HoverWidget(
    builder:(context,isHovered)=>Container(child:....)
  )

BreadCumb

NextBreadCumbItem(child: (isHovered) => Text(e))) .toList()), SizedBox(height: 20), Text("With Custom Separator"), SizedBox(height: 10), NextBreadCumb( seperator: Text("---"), childrens: ["A", "B", "C", "D", "E", "F", "G", "H"] .map( (e) => NextBreadCumbItem(child: (isHovered) => Text(e)), ) .toList()),">

   NextBreadCumb(
      childrens: ["Home", "Dashboard", "Payment", "Checkout"]
          .map((e) => NextBreadCumbItem(child: (isHovered) => Text(e)))
          .toList()),
    SizedBox(height: 20),
    Text("With Custom Separator"),
    SizedBox(height: 10),
    NextBreadCumb(
        seperator: Text("---"),
        childrens: ["A", "B", "C", "D", "E", "F", "G", "H"]
            .map(
              (e) => NextBreadCumbItem(child: (isHovered) => Text(e)),
            )
            .toList()),

Additionally you can provide variant

Wrap (If exceeds more than width then it will move to next line)
Scroll (It will scroll horizontally)

Alerts

Define an alert by:

  NextAlert(
    child: Text("Yo, this is primary alert"),
    onClosedIconPressed: () {},
    margin: EdgeInsets.only(bottom: 15),
  ),

You can use multiple variant of alerts

  NextAlert(
    variant: NextVariant.secondary,
    child: Text("Yo, this is primary alert"),
    onClosedIconPressed: () {},
    margin: EdgeInsets.only(bottom: 15),
  ),

And you can even define custom,variant should be custom

 NextAlert(
    variant: NextVariant.custom,
    customConfigs: NextAlertColorUtils(
      borderColor: Colors.black,
      backgroundColor: Colors.pink,
      color: Colors.deepOrange,
    ),
    child: Text("Yo, this is primary alert"),
    onClosedIconPressed: () {},
    margin: EdgeInsets.only(bottom: 15),
  ),

Grid System

	Extra small <576px	Small ≥576px	Medium ≥768px	Large ≥992px	Extra large ≥1200px
Max container width	None (auto)	540px	720px	960px	1140px
Class prefix	`col-`	`col-sm-`	`col-md-`	`col-lg-`	`col-xl-`

NextCol( sizes: e, child: Container( height: 100, decoration: BoxDecoration(color: Colors.orange), child: Center( child: Text( e, textAlign: TextAlign.center, style: TextStyle(color: Colors.white), ), ), width: double.infinity, ))) .toList())">

NextRow(
  verticalSpacing: 15,
  horizontalSpacing: 15,
  children: [
    "col-12 col-md-6 col-lg-4",
    "col-12 col-md-6 col-lg-4",
    "col-12 col-md-3 col-lg-4 col-sm-6 col-xs-6",
    "col-12 col-md-3 col-lg-4 col-sm-6 col-xs-6"
  ]
      .map((e) => NextCol(
          sizes: e,
          child: Container(
            height: 100,
            decoration: BoxDecoration(color: Colors.orange),
            child: Center(
              child: Text(
                e,
                textAlign: TextAlign.center,
                style: TextStyle(color: Colors.white),
              ),
            ),
            width: double.infinity,
          )))
      .toList())

Next Grid

NextGridItem( child: Text( "$index ${NextUtils.getPrefixByWidth(context.width)}") .center() .sizedBox(width: double.infinity, height: 100) .addDecoration(BoxDecoration( color: Colors.orange, borderRadius: BorderRadius.circular(8))))))">

 NextGridView(
  sizes: "col-6 col-md-3 col-lg-4 col-xl-3 col-xs-6",
  childrens: List.generate(
      12,
      (index) => NextGridItem(
          child: Text(
                  "$index ${NextUtils.getPrefixByWidth(context.width)}")
              .center()
              .sizedBox(width: double.infinity, height: 100)
              .addDecoration(BoxDecoration(
                  color: Colors.orange,
                  borderRadius: BorderRadius.circular(8))))))

Additionaly you can even provide vertical spacing or horizontal spacing and for each children you can even define separate sizes

NextGridItem(
  sizes: "col-12 col-md-6 col-lg-6",
  ....
)

Container

	Extra small <576px	Small ≥576px	Medium ≥768px	Large ≥992px	X-Large ≥1200px	XX-Large ≥1400px
`Next Container`	100%	540px	720px	960px	1140px	1320px

If you pass fluid as true then it will take whole width

Accordion

 NextAccordion(
    initiallyExpanded: true,
    backgroundColor: Colors.white,
    collapsedBackgroundColor: Colors.white,
    title: Text("Hey this it title which is initially Expanded"),
    children: [
      Padding(
        padding: EdgeInsets.symmetric(vertical: 20, horizontal: 10),
        child: NextAlert(
          child: Text("Yo this is child"),
        ),
      )
    ],
  ),

Button

You can customise button by using itemBuilder

Icon(Icons.headset_rounded, color: color) .paddingSymmetric(horizontal: 20, vertical: 10) .decoration(BoxDecoration( border: Border.all(color: context.primaryColor, width: 1.5), color: !isHovered ? context.primaryColor : Colors.white, borderRadius: BorderRadius.circular(8), )), )">

   NextButton(
    onPressed: () {},
    style: TextStyle(color: Colors.white),
    child: Text(
      "Filled Button",
      style: TextStyle(color: Colors.white),
    ),
  ),
  SizedBox(height: 20),
  NextButton(
    onPressed: () {},
    variant: NextButtonVariant.outlined,
    child: Text("Outline Button"),
  ),
  NextButton(
    onPressed: () {},
    variant: NextButtonVariant.outlined,
    itemBuilder: (context, isHovered, color) =>
        Icon(Icons.headset_rounded, color: color)
            .paddingSymmetric(horizontal: 20, vertical: 10)
            .decoration(BoxDecoration(
              border:
                  Border.all(color: context.primaryColor, width: 1.5),
              color: !isHovered ? context.primaryColor : Colors.white,
              borderRadius: BorderRadius.circular(8),
            )),
  )

the param color in itemBuilder is a color tween between color and outline color provided in button

Animations

Available Animations

Slide Animation
- SlideInLeft
- SlideInRight
- SlideInTop
- SlideInBottom
Zoom Animation
- ZoomIn
- ZoomOut
Fade Animation
- FadeInLeft
- FadeInRight
- FadeInTop
- FadeInBottom
- FadeOutLeft
- FadeOutRight
- FadeOutTop
- FadeOutBottom
Flip Animation
- Flipx
- FlipY
Bounce Animation
- BounceInLeft
- BounceInRight
- BounceInTop
- BounceInBottom

 Text("Fade In Animations").customPadding(bottom: 20),
  Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
      ContainerThing().fadeIn(
          variant: NextFadeInVariant.fadeInLeft,
          duration: Duration(milliseconds: 600)),
      ContainerThing().fadeIn(
          variant: NextFadeInVariant.fadeInTop,
          duration: Duration(milliseconds: 600)),
      ContainerThing().fadeIn(
          variant: NextFadeInVariant.fadeInBottom,
          duration: Duration(milliseconds: 600)),
      ContainerThing().fadeIn(
          variant: NextFadeInVariant.fadeInRight,
          duration: Duration(milliseconds: 600)),
    ],
  ),
  SizedBox(height: 20),
  Text("Fade out Animations").customPadding(bottom: 20),
  Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
      ContainerThing(
        color: Colors.red,
      ).fadeOut(
          variant: NextFadeOutVariant.fadeOutLeft,
          duration: Duration(milliseconds: 600)),
      ContainerThing(
        color: Colors.red,
      ).fadeOut(
          variant: NextFadeOutVariant.fadeOutTop,
          duration: Duration(milliseconds: 600)),
      ContainerThing(
        color: Colors.red,
      ).fadeOut(
          variant: NextFadeOutVariant.fadeOutBottom,
          duration: Duration(milliseconds: 600)),
      ContainerThing(
        color: Colors.red,
      ).fadeOut(
          variant: NextFadeOutVariant.fadeOutRight,
          duration: Duration(milliseconds: 600)),
    ],
  ),
  SizedBox(height: 20),
  Text("Flip Animations").customPadding(bottom: 20),
  Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
      ContainerThing(
        color: Colors.yellow,
      ).flip(
          variant: NextFlipVariant.flipX,
          duration: Duration(milliseconds: 600)),
      ContainerThing(
        color: Colors.yellow,
      ).flip(
          variant: NextFlipVariant.flipY,
          duration: Duration(milliseconds: 600)),
    ],
  ),
  SizedBox(height: 20),
  Text("Zoom Animations").customPadding(bottom: 20),
  Row(
    mainAxisAlignment: MainAxisAlignment.spaceAround,
    children: [
      ContainerThing().zoom(variant: NextZoomVariant.zoomIn),
      ContainerThing().zoom(variant: NextZoomVariant.zoomOut),
    ],
  )

Extensions

Widget Extensions

Now you can add onTap function easily

Widget().onTap((){
  ....
})

Double Tap

Widget().onDoubleTap((){
  ....
})

On Long press

Widget().onLongPress((){
  ....
})

And center your widget easily

Widget(
  child:...
).center()

And for column/row/stack

[Widget1(),Widget2(),Widget3()].column(
  // Additionally you can provide mainAxis and remaining params here
)

For decoration

Widget().addDecoration(BoxDecoration(
  // Add params here
))

you can even use clipRRect,clipper,safearea etc...

Context

Now access themedata and mediaquery data easily like

  context.themeData
  context.textTheme
  context.buttonTheme
  context.snackBarTheme

Or if you want to develop responsive views w.r.t height and width

  context.height
  context.width

And for colors

  context.primaryColor
  context.backgroundColor
  context.canvasColor
  context.dividerColor

Padding

Instead of

Padding(
  padding: const EdgeInsets.all(20)
  child:Widget(
    child...
  )
)

You can use

Widget(
  child:...
).pad(20)
// Or
Widget(
  child:...
).paddingSymmetric(horizontal:20,vertical:12)
//or
Widget(
  child:...
).customPadding(left:10,right:12)

String

We provide handful of string extensions
- "string".capitalize() // Output is: String
- "45".toInt() // Output is: 45
- "45.4".toDouble() // Output is: 45.4
- "flutter".isInt() //Output is: False
- "flutter".isDouble() //Output is: False
- "flutter".toDouble() //Output is: null

Bool

false.toggle() //Output is true

Shadows

  ContainerThing(
    shadows: NextShadow.shadow100()
  ),

Additionally you can provide customshadow color

  ContainerThing(
    shadows: NextShadow.shadow100(color:Colors.red)
  ),

🔗 Links

Contributions

Contributions are always welcome
Follow the linting

Welcome to Renovate! This is an onboarding PR to help you understand and configure settings before regular Pull Requests begin.

🚦 To activate Renovate, merge this Pull Request. To disable Renovate, simply close this Pull Request unmerged.

Detected Package Files

example/android/gradle.properties (gradle)
example/android/settings.gradle (gradle)
example/android/build.gradle (gradle)
example/android/app/build.gradle (gradle)
example/android/gradle/wrapper/gradle-wrapper.properties (gradle-wrapper)
example/pubspec.yaml (pub)
pubspec.yaml (pub)

Configuration Summary

Based on the default config's presets, Renovate will:

Start dependency updates only once this onboarding PR is merged
Enable Renovate Dependency Dashboard creation
If semantic commits detected, use semantic commit type fix for dependencies and chore for all others
Ignore node_modules, bower_components, vendor and various test/tests directories
Autodetect whether to pin dependencies or maintain ranges
Rate limit PR creation to a maximum of two per hour
Limit to maximum 10 open PRs at any time
Group known monorepo packages together
Use curated list of recommended non-monorepo package groupings
A collection of workarounds for known problems with packages

🔡 Would you like to change the way Renovate is upgrading your dependencies? Simply edit the renovate.json in this branch with your custom config and the list of Pull Requests in the "What to Expect" section below will be updated the next time Renovate runs.

What to Expect

With your current configuration, Renovate will create 7 Pull Requests:

Update dependency com.android.tools.build:gradle to v4.2.2

Schedule: ["at any time"]
Branch name: renovate/com.android.tools.build-gradle-4.x
Merge into: master
Upgrade com.android.tools.build:gradle to 4.2.2

Update dependency gradle to v6.9.2

Schedule: ["at any time"]
Branch name: renovate/gradle-6.x
Merge into: master
Upgrade gradle to 6.9.2

Update dependency visibility_detector to ^0.3.0

Schedule: ["at any time"]
Branch name: renovate/visibility_detector-0.x
Merge into: master
Upgrade visibility_detector to ^0.3.0

Update kotlin_version to v1.7.0

Schedule: ["at any time"]
Branch name: renovate/kotlin_version
Merge into: master
Upgrade org.jetbrains.kotlin:kotlin-stdlib-jdk7 to 1.7.0
Upgrade org.jetbrains.kotlin:kotlin-gradle-plugin to 1.7.0

Update dependency com.android.tools.build:gradle to v7

Schedule: ["at any time"]
Branch name: renovate/com.android.tools.build-gradle-7.x
Merge into: master
Upgrade com.android.tools.build:gradle to 7.2.1

Update dependency flutter_lints to v2

Schedule: ["at any time"]
Branch name: renovate/flutter_lints-2.x
Merge into: master
Upgrade flutter_lints to ^2.0.0

Update dependency gradle to v7

Schedule: ["at any time"]
Branch name: renovate/gradle-7.x
Merge into: master
Upgrade gradle to 7.4.2

🚸 Branch creation will be limited to maximum 2 per hour, so it doesn't swamp any CI resources or spam the project. See docs for prhourlylimit for details.

❓ Got questions? Check out Renovate's Docs, particularly the Getting Started section. If you need any further assistance then you can also request help here.

This PR has been generated by Mend Renovate. View repository job log here.

A widget that imposes different constraints on its child than it gets from its parent

A widget that imposes different constraints on its child than it gets from its parent, possibly allowing the child to overflow the parent. Similar to `OverflowBox` except that the unconstrained width or height is sized to the intrinsic size of the child, instead of being assumed to be infinite, which allows IntrinsicSizeOverflowBox to be used in a `Scrollable` widget.

Dec 7, 2022

Configure Renovate
Welcome to Renovate! This is an onboarding PR to help you understand and configure settings before regular Pull Requests begin.

🚦 To activate Renovate, merge this Pull Request. To disable Renovate, simply close this Pull Request unmerged.

Detected Package Files

example/android/gradle.properties (gradle)

example/android/settings.gradle (gradle)

example/android/build.gradle (gradle)

example/android/app/build.gradle (gradle)

example/android/gradle/wrapper/gradle-wrapper.properties (gradle-wrapper)

example/pubspec.yaml (pub)

pubspec.yaml (pub)

Configuration Summary

Based on the default config's presets, Renovate will:

Start dependency updates only once this onboarding PR is merged

Enable Renovate Dependency Dashboard creation

If semantic commits detected, use semantic commit type fix for dependencies and chore for all others

Ignore node_modules, bower_components, vendor and various test/tests directories

Autodetect whether to pin dependencies or maintain ranges

Rate limit PR creation to a maximum of two per hour

Limit to maximum 10 open PRs at any time

Group known monorepo packages together

Use curated list of recommended non-monorepo package groupings

A collection of workarounds for known problems with packages

🔡 Would you like to change the way Renovate is upgrading your dependencies? Simply edit the renovate.json in this branch with your custom config and the list of Pull Requests in the "What to Expect" section below will be updated the next time Renovate runs.

What to Expect

With your current configuration, Renovate will create 7 Pull Requests:

Update dependency com.android.tools.build:gradle to v4.2.2

Schedule: ["at any time"]

Branch name: renovate/com.android.tools.build-gradle-4.x

Merge into: master

Upgrade com.android.tools.build:gradle to 4.2.2

Update dependency gradle to v6.9.2

Schedule: ["at any time"]

Branch name: renovate/gradle-6.x

Merge into: master

Upgrade gradle to 6.9.2

Update dependency visibility_detector to ^0.3.0

Schedule: ["at any time"]

Branch name: renovate/visibility_detector-0.x

Merge into: master

Upgrade visibility_detector to ^0.3.0

Update kotlin_version to v1.7.0

Schedule: ["at any time"]

Branch name: renovate/kotlin_version

Merge into: master

Upgrade org.jetbrains.kotlin:kotlin-stdlib-jdk7 to 1.7.0

Upgrade org.jetbrains.kotlin:kotlin-gradle-plugin to 1.7.0

Update dependency com.android.tools.build:gradle to v7

Schedule: ["at any time"]

Branch name: renovate/com.android.tools.build-gradle-7.x

Merge into: master

Upgrade com.android.tools.build:gradle to 7.2.1

Update dependency flutter_lints to v2

Schedule: ["at any time"]

Branch name: renovate/flutter_lints-2.x

Merge into: master

Upgrade flutter_lints to ^2.0.0

Update dependency gradle to v7

Schedule: ["at any time"]

Branch name: renovate/gradle-7.x

Merge into: master

Upgrade gradle to 7.4.2

🚸 Branch creation will be limited to maximum 2 per hour, so it doesn't swamp any CI resources or spam the project. See docs for prhourlylimit for details.

❓ Got questions? Check out Renovate's Docs, particularly the Getting Started section. If you need any further assistance then you can also request help here.

This PR has been generated by Mend Renovate. View repository job log here.
opened by renovate[bot] 0
[ImgBot] Optimize images

Beep boop. Your images are optimized!

Your image file size has been reduced by 21% 🎉

Details

| File | Before | After | Percent reduction | |:--|:--|:--|:--| | /example/assets/breadcumb_example.png | 15.66kb | 6.07kb | 61.23% | | /example/assets/shadows_example.png | 90.41kb | 44.84kb | 50.40% | | /example/web/icons/Icon-maskable-512.png | 20.51kb | 10.54kb | 48.61% | | /example/assets/accordion_example.png | 32.05kb | 21.11kb | 34.13% | | /example/web/icons/Icon-maskable-192.png | 5.46kb | 3.66kb | 33.05% | | /example/assets/alert_example.png | 211.19kb | 150.36kb | 28.80% | | /example/assets/Flutter Next.png | 12.43kb | 9.83kb | 20.93% | | /example/assets/animation_example.gif | 194.84kb | 175.25kb | 10.05% | | /example/assets/button_example.gif | 247.29kb | 225.53kb | 8.80% | | /example/assets/avatar_example.png | 93.02kb | 84.98kb | 8.64% | | | | | | | Total : | 922.86kb | 732.17kb | 20.66% |

📝 docs | :octocat: repo | 🙋🏾 issues | 🏪 marketplace

~Imgbot - Part of Optimole family

opened by imgbot[bot] 0
[ImgBot] Optimize images

Beep boop. Your images are optimized!

Your image file size has been reduced by 10% 🎉

Details

| File | Before | After | Percent reduction | |:--|:--|:--|:--| | /example/one_page/web/icons/Icon-maskable-512.png | 20.51kb | 10.54kb | 48.61% | | /example/one_page/web/icons/Icon-maskable-192.png | 5.46kb | 3.66kb | 33.05% | | /example/one_page/assets/testimonials/testimonials-1.jpg | 38.80kb | 37.44kb | 3.49% | | /example/one_page/assets/testimonials/testimonials-2.jpg | 56.23kb | 54.78kb | 2.58% | | /example/one_page/assets/testimonials/testimonials-4.jpg | 19.75kb | 19.60kb | 0.73% | | | | | | | Total : | 140.75kb | 126.02kb | 10.46% |

📝 docs | :octocat: repo | 🙋🏾 issues | 🏪 marketplace

~Imgbot - Part of Optimole family

opened by imgbot[bot] 0

An advanced flutter package to build responsive application accross all platform with ease and has an handful of different types of extension

Related tags

Overview

Flutter Next

Features

Usage/Examples

Appendix

Widgets

Avatar

Hover Widget

BreadCumb

Alerts

Grid System

Next Grid

Container

Accordion

Button

Animations

Available Animations

Extensions

Widget Extensions

Context

Padding

String

Bool

Shadows

🔗 Links

Contributions

You might also like...

Comments

Detected Package Files

Configuration Summary

What to Expect

Beep boop. Your images are optimized!

Beep boop. Your images are optimized!

Owner

Shashi Kumar

An awesome Flutter package with widget extension.

PowerFileView - A powerful file view widget, support a variety of file types, such as Doc Eexcl PPT TXT PDF and so on, Android is implemented by Tencent X5, iOS is implemented by WKWebView.

An Extension library for Flutter Widgets.

Expanded Widget Advanced Design For Flutter

An advanced switch widget, that can be fully customized with size, text, color, radius of corners.

AdvFAB - An Advanced floating action button that expands itself to reveal its hidden widget

A Redux version tailored for Flutter, which is easy to learn, to use, to test, and has no boilerplate

The flutter_otp_text_field package for flutter is a TextField widget that allows you to display different style pin.

The color of the widget is different with the counter application

A repository to create and compare different methodologies of reusing local widget state logics.