FWidget takes care to provide elegant components to help you build beautiful applications.
Toast tips are a visual element that is considered essential for modern applications.
Today, FWidget presents developers with Toast components that developers are familiar with and unfamiliar with.
✨ features
Developers, is this a Toast you’re familiar with?
-
Provide a convenient way to create toasts
-
Support for primary and secondary information, and customize their styles
-
Supports flexible icon views
-
Supports the configuration of corner size and background color
-
Support queue display
-
Supports custom Toast styles
🛸 transfer zone
🛸 [Portal: FToast Github homepage]
📖 [Portal: FToast document]
🔩 Basic use
Familiar usage, but more so than ever
FToast.toast(
context,
// configure the display duration
///
/// Configure display duration
duration: 800.
/ / / configure Msg
///
/// set Msg
msg: "I'm FToast: ${count++}".
// configure the Msg style
///
/// set Msg style
msgStyle: TextStyle(color: Colors.white),
)
Copy the codeIn the simplest case, creating a Toast element is as simple as ever.
FToast.toast(context, msg: "Hi, FWidget");
Copy the codeOf course, in FToast, developers can easily configure the copywriting style with the msgStyle property.
In addition, FToast implements queue presentation capabilities in Flutter, which is consistent with Toast in Android.
🔆 deputy information
More tips
FToast.toast(
context,
msg: "This is Msg".
/ / / configure subMsg
///
/// set subMsg
subMsg: "Welcome to use FToast. This is subMsg!".
// configure the SubMsg style
///
/// set SubMsg style
subMsgStyle: TextStyle(color: Colors.white, fontSize: 13),
)
Copy the codeFToast is different from the previous Toast in that it supports the configuration of the secondary copy. Because of this, developers can display more hints.
🔳 icon
More elegant
FToast.toast(
context,
msg: "This is Msg".
subMsg: "Welcome to use FToast. This is subMsg!".
/// Configure the icon
///
/// set image
image: Icon(
Icons.star,
color: Colors.yellow,
),
/// Sets the position of the icon relative to the text
///
/// set position of icon relative to text
imageDirection: up,
)
Copy the codeFToast allows developers to configure a decorative icon and control its relative position. In pursuit of beauty, FWidget is not just a joke.
🔩 Custom styles
Unlimited, creative bloom
FToast.toast(
context,
/// Customize Toast styles
///
/// Custom Toast style
toast: FSuper(
text: "Custom Toast".
style: TextStyle(color: Colors.grey),
padding: EdgeInsets.all(12),
shadowColor: Colors.yellow,
shadowBlur: 80.
),
)
Copy the codeIf the preset toasts still don’t satisfy the developer’s fantasy, FToast allows developers to customize any toasts.
Developers only need to care about styles and leave the rest to FToast.
Want more details? Please visit theFToastOfficial homepage (PS: Don’t forget to submit one you agree withStarOh 😘).
How do I use 😃?
Add dependencies to the project pubspec.yaml file:
🌐 pub Dependent mode
dependencies:
Ftoast: ^< version number >
Copy the code⚠️ Note, please go to pub for the latest version number of FToast
🖥 Git dependency mode
dependencies:
ftoast:
git:
url: '[email protected]:Fliggy-Mobile/ftoast.git'
ref: '< branch number or tag>'
Copy the code⚠️ Note that the branch number or tag is subject to the official PROJECT of FToast.
Feeling good? Please go to the Github homepage of FToast and submit a Star you like 🌟!
More exciting components
-
FSuper – Helps developers build beautifully complex views quickly
-
FButton – Lots of nice configuration options for developers
-
FSwitch – Beautiful switch elements with excellent interaction and visuals
-
FRadio – a radio component for almost any radio scenario
-
FFloat — Everything you can imagine for a floating element
-
FRefresh – Easily build pull-down refresh effects
-
FDottedLine – Brilliant dotted line effect
-
FSearch – a complete search box component