Comments (3)
thanks
from getx.
@tospery If this helps you can close the issue
To display an icon and messageText in a Get.snackbar
with its own size instead of taking up the maximum width, you can customize the Get.snackbar
widget. Here's an example of how you can achieve this:
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void showCustomSnackbar() {
Get.snackbar(
'Title',
'',
messageText: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.info, color: Colors.white),
SizedBox(width: 8),
Expanded(
child: Text(
'Your message here',
style: TextStyle(color: Colors.white),
),
),
],
),
backgroundColor: Colors.black,
snackPosition: SnackPosition.BOTTOM,
borderRadius: 8,
margin: EdgeInsets.all(10),
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
boxShadows: [
BoxShadow(
color: Colors.black.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 10,
),
],
duration: Duration(seconds: 3),
);
}
Explanation:
- messageText: Used to customize the message area of the snackbar.
- Row: Used to place the icon and the text next to each other.
- mainAxisSize: MainAxisSize.min: Ensures that the
Row
takes up only as much horizontal space as needed by its children. - Icon: Displays the icon.
- SizedBox: Provides space between the icon and the text.
- Expanded: Ensures that the text takes up the remaining space within the
Row
.
Usage:
You can call showCustomSnackbar
whenever you need to display the snackbar. For example, you might call it in a button's onPressed
callback:
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Snackbar Example')),
body: Center(
child: ElevatedButton(
onPressed: showCustomSnackbar,
child: Text('Show Snackbar'),
),
),
),
);
}
}
This will display a Get.snackbar
with an icon and message text that sizes itself appropriately rather than taking up the maximum width. Adjust the styling as needed to fit your design requirements.
from getx.
If you want to call it from the controller also
Sure, let's simplify the implementation by removing the showLocalSnackbar
method and only using the controller to show the snackbar.
Controller Implementation
File: lib/controllers/snackbar_controller.dart
import 'package:get/get.dart';
import 'package:flutter/material.dart';
class SnackbarController extends GetxController {
void showCustomSnackbar() {
Get.snackbar(
'Title',
'',
messageText: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(Icons.info, color: Colors.white),
SizedBox(width: 8),
Expanded(
child: Text(
'Your message here',
style: TextStyle(color: Colors.white),
),
),
],
),
backgroundColor: Colors.black,
snackPosition: SnackPosition.BOTTOM,
borderRadius: 8,
margin: EdgeInsets.all(10),
padding: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
boxShadows: [
BoxShadow(
color: Colors.black.withOpacity(0.5),
spreadRadius: 1,
blurRadius: 10,
),
],
duration: Duration(seconds: 3),
);
}
}
View Implementation
Explanation:
- SnackbarController: Contains the
showCustomSnackbar
method to display the snackbar. - HomeScreen: Uses the
SnackbarController
to show the snackbar when the button is pressed.
Final Code for lib/main.dart
:
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'controllers/snackbar_controller.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GetMaterialApp(
home: HomeScreen(),
);
}
}
class HomeScreen extends StatelessWidget {
final SnackbarController snackbarController = Get.put(SnackbarController());
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Snackbar Example')),
body: Center(
child: ElevatedButton(
onPressed: () {
snackbarController.showCustomSnackbar();
},
child: Text('Show Snackbar from Controller'),
),
),
);
}
}
This setup ensures you only use the controller to manage snackbar notifications, maintaining a clean and organized codebase.
from getx.
Related Issues (20)
- Add privacy manifest file for iOS
- Returns to an existing page and cannot refresh the controller HOT 3
- Maximum Flutter Version support for GetX4? HOT 1
- CupertinoRouteTransitionMixin.isPopGestureInProgress(route) exception HOT 7
- Concerns About the Future Maintenance of GetX HOT 1
- Support to Flutter web WASM HOT 2
- Get.reload not work !!! HOT 1
- [5.0.0-release-candidate-6] Kindly push the latest commits and release for pub.dev HOT 21
- FlutterError - type 'Null' is not a subtype of type 'Controller' in type cast
- Grey screen Errors in Release Mode HOT 9
- Need change dark mode theme HOT 5
- getx is dead? HOT 1
- Navigation Transition HOT 1
- Can't load Kernel binary: Invalid kernel binary format version HOT 1
- Please add new transition type: Transition.predictiveBack HOT 1
- Get 5.0.0 Nested Navigation duplicate routes HOT 5
- You need to call "Get.put(xx)" or "Get.lazyPut(()=>xx()) HOT 7
- Nested Navigation State Not Retained on Back to "Navigation" Tab HOT 2
- Unable to ecustomize `rootDelegate.pickPagesForRootNavigator` HOT 1
- Keyboard not appearing after swipe-back gesture when returning to a screen with TextField using GetX HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from getx.