I'm using Flutter Flag package to show countries flags. When trying to specify for England, Wales, N-Ireland or Scotland flag, it returns the replacement flag.
Flag.fromString('gb-eng',
height: 18,
width: 18,
fit: BoxFit.fitWidth,
replacement: Container(
height: 18,
width: 18,
decoration: BoxDecoration(
image: const DecorationImage(
image: AssetImage(replacementFlag),
fit: BoxFit.contain,
)),
)),
I tried using the Flag.fromCode format too, and that doesn't work too.
The gb works though.
How do I get the England flag?
Looks like bug in the package. Fortunately, you can use provided resource in flags package directly.
#pubspec.yaml
name: temp
description: A new Flutter project.
publish_to: "none"
version: 1.0.0+1
environment:
sdk: ">=2.19.2 <3.0.0"
dependencies:
cupertino_icons: ^1.0.2
flag: ^6.0.0
flutter:
sdk: flutter
flutter_svg: ^2.0.1
dev_dependencies:
flutter_lints: ^2.0.0
flutter_test:
sdk: flutter
dependency_overrides:
flutter_svg: ^2.0.1
flutter:
uses-material-design: true
// main.dart
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
useMaterial3: true,
),
home: const MyHomePage());
}
}
class MyHomePage extends StatelessWidget {
const MyHomePage({super.key});
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Flag'),
),
body: Center(
child: SvgPicture.asset(
"res/4x3/gb-eng.svg",
package: "flag",
),
),
);
}
}
Since we are not using Flags widget, we don't case what version of flutter_svg it depended on hence overridden it in pubspec.yaml
Output:
Related
I am write a simple GTD app using flutter(v3.0.4), now I facing a problem is that I did not know how to tweak the position of ListTile checkbox and title, this is the minimal reproduce example code of main.dart:
import 'dart:collection';
import 'package:flutter/material.dart';
import 'package:flutter_slidable/flutter_slidable.dart';
import 'package:get/get_state_manager/src/simple/get_state.dart';
import 'main_controller.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: new MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
Map<int, String> getCategories() {
Map<int, String> categories = HashMap<int, String>();
categories.putIfAbsent(1, () => "已过期");
return categories;
}
#override
Widget build(BuildContext context) {
return GetBuilder<MainController>(
init: MainController(),
builder: (controller) {
return Scaffold(
//appBar: AppBar(title: Text("title")),
body: SingleChildScrollView(
child: ListView.builder(
scrollDirection: Axis.vertical,
shrinkWrap: true,
itemBuilder: (BuildContext context, int index) => Padding(
padding: const EdgeInsets.symmetric(horizontal: 6.0),
child: Card(
child: ExpansionTile(
title: Text(getCategories()[index + 1]!),
children: [
Slidable(
actionPane: SlidableDrawerActionPane(),
actionExtentRatio: 0.25,
actions: <Widget>[
IconSlideAction(
caption: '删除',
color: Colors.blue,
icon: Icons.archive,
onTap: () async => {},
),
],
child: ListTile(
trailing: Text(
"scheduleTime",
style: new TextStyle(color: Colors.blue),
),
leading: Theme(
data: ThemeData(
primarySwatch: Colors.blue,
),
child: Checkbox(
value: false,
onChanged: (bool? value) {},
)),
title: Text("element.name", overflow: TextOverflow.ellipsis),
selected: false,
onTap: () {},
),
)
],
),
),
),
itemCount: getCategories().length),
),
);
});
}
}
this is the main_controller.dart:
import 'package:get/get.dart';
import 'package:get/get_state_manager/src/simple/get_controllers.dart';
class MainController extends GetxController {}
this is the dependencies:
name: untitled
description: A new Flutter project.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.16.1 <3.0.0"
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.2
get: ^4.3.8
flutter_slidable: 0.6.0
dev_dependencies:
flutter_test:
sdk: flutter
flutter_lints: ^1.0.0
flutter:
uses-material-design: true
what should I do to make the checkbox and title more closer? move the checkbox to left a littile. This is the result looks like right now:
the checkbox and title should be more closer.
ListTile has a property named horizontalTitleGap which can control the spacing.
enter image description here
I dont understand why this error occur, is my code have any problem?
The error
The named parameter 'fixedPlayer' isn't defined.
Try correcting the name to an existing named parameter's name, or defining a named parameter with the name 'fixedPlayer'.
The method 'play' isn't defined for the type 'AudioCache'.
Try correcting the name to the name of an existing method, or defining a method named 'play'.
main.dart
import 'package:audioplayers/audioplayers.dart';
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
// This is the theme of your application.
//
// Try running your application with "flutter run". You'll see the
// application has a blue toolbar. Then, without quitting the app, try
// changing the primarySwatch below to Colors.green and then invoke
// "hot reload" (press "r" in the console where you ran "flutter run",
// or simply save your changes to "hot reload" in a Flutter IDE).
// Notice that the counter didn't reset back to zero; the application
// is not restarted.
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String _counter = '';
///Audio player
AudioPlayer? audioPlayer;
late AudioCache audioCache;
#override
void initState() {
super.initState();
setState(() {
audioPlayer = AudioPlayer();
audioCache = AudioCache(fixedPlayer: audioPlayer);
});
}
void playAudio() {
audioPlayer!.stop();
audioCache.play('music.mp3');
}
void stopAudio() {
audioPlayer!.stop();
}
#override
void dispose() {
audioPlayer!.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
audioPlayer!.getCurrentPosition().then((value) {
setState(() {
_counter = value.toString();
});
});
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Text(
'You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: Column(
mainAxisAlignment: MainAxisAlignment.end,
children: [
FloatingActionButton(
onPressed: playAudio,
tooltip: 'Play',
child: const Icon(Icons.play_arrow),
),
const SizedBox(
height: 10,
),
FloatingActionButton(
onPressed: stopAudio,
tooltip: 'Stop',
child: const Icon(Icons.stop),
),
],
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
pubspec.yaml
version: 1.0.0+1
environment:
sdk: ">=2.17.1 <3.0.0"
# Dependencies specify other packages that your package needs in order to work.
# To automatically upgrade your package dependencies to the latest versions
# consider running `flutter pub upgrade --major-versions`. Alternatively,
# dependencies can be manually updated by changing the version numbers below to
# the latest version available on pub.dev. To see which dependencies have newer
# versions available, run `flutter pub outdated`.
dependencies:
audioplayers: ^1.0.1
carousel_slider: ^4.1.1
cloud_firestore: ^3.1.17
cupertino_icons: ^1.0.2
firebase_auth: ^3.3.19
firebase_core: ^1.17.1
flame: ^1.0.0-rc7
flame_audio: ^1.2.0
flutter:
sdk: flutter
just_audio: ^0.9.25
provider: ^6.0.3
shared_preferences_web: ^2.0.4
dev_dependencies:
carousel_pro: ^1.0.0
flutter_carousel_slider: ^1.0.8
flutter_launcher_icons: ^0.9.2
flutter_lints: ^2.0.0
flutter_test:
sdk: flutter
fluttertoast: ^8.0.9
You need to provide source to play and play method can be call on AudioPlayer
audioPlayer!.play(AssetSource("music.mp3"));
You can check the documentation of audioplayers
///Audio player
AudioPlayer? audioPlayer;
#override
void initState() {
super.initState();
audioPlayer = AudioPlayer();
audioPlayer!.setSourceAsset("");
}
void playAudio() async {
await audioPlayer!.stop();
audioPlayer!.play(AssetSource("music.mp3"));
}
void stopAudio() {
audioPlayer?.stop();
}
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void main(List args) {
runApp(GetMaterialApp(
title: 'My App',
home: MyApp(),
));
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
ElevatedButton(
onPressed: () {
Get.snackbar(
'Hello',
'Hello World!',
snackPosition: SnackPosition.TOP,
);
},
child: Text('GetX Buttom')),
],
),
),
);
}
}
have you imported the get package? if not, you can add it in pubspec.yaml file, inside dev_dependencies.
example:
dev_dependencies:
flutter_test:
sdk: flutter
get: ^4.6.1
then save your pubspec.yaml file and type flutter pub get in your terminal
the result will be like this:
you can read more about getX in this documentation
I've been trying to use namedRoutes with a custom 'NavLink' component to add to my drawer but the links are not navigating to the clicked screen. They do not throw error logs when I click them so I don't know what is happening.
main.dart
import 'package:flutter/material.dart';
import 'package:hire_me/homepage.dart';
import 'package:hire_me/screens/notFound.dart';
import 'package:hire_me/screens/todoList.dart';
import 'package:hire_me/screens/nodeJs.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'My Portfolio',
theme: ThemeData(
primarySwatch: Colors.blue,
textTheme: TextTheme(
headline1: TextStyle(
fontSize: 36.0,
fontWeight: FontWeight.bold,
color: Colors.black),
headline2:
TextStyle(fontSize: 18.0, fontWeight: FontWeight.bold),
bodyText1:
TextStyle(fontSize: 12.0, fontWeight: FontWeight.normal))),
initialRoute: '/',
routes: {
'/': (context) => HomePage(),
'/todoList': (context) => TodoList(),
'/nodeJs': (context) => NodeJs(),
'/notFound': (context) => NotFound(),
});
}
}
Homepage component
class HomePage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Carlos Gumucio'),
centerTitle: true,
),
drawer: Drawer(
child: ListView(
padding: EdgeInsets.zero,
children: <Widget>[
DrawerHeader(
decoration: BoxDecoration(
color: Colors.blue,
),
child: Text('More from me')),
NavLink(title: 'Todo List', route: '/todoList'),
NavLink(title: 'NodeJs API', route: '/nodeJs'),
],
)),
body: SingleChildScrollView(...
navLink.dart component
import 'package:flutter/material.dart';
class NavLink extends StatelessWidget {
const NavLink({Key? key, this.title = 'link here', this.route = '/notFound'})
: super(key: key);
final String title;
final String route;
#override
Widget build(BuildContext context) {
return ListTile(
title: Text(title),
onTap: () {
// go to route ... Navigator.push(context, route)
Navigator.pushNamed(context, route);
// close the nav after navigating
Navigator.pop(context);
});
}
}
pubspec.yaml
name: hire_me
description: Reach me hub.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.12.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2
url_launcher: ^6.0.4
material_design_icons_flutter: ^4.0.5955
google_fonts: ^2.0.0
dev_dependencies:
flutter_test:
sdk: flutter
# For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec
# The following section is specific to Flutter.
flutter:
# The following line ensures that the Material Icons font is
# included with your application, so that you can use the icons in
# the material Icons class.
uses-material-design: true
assets:
- assets/images/
flutter doctor
[√] Flutter (Channel beta, 2.2.0-10.3.pre, on Microsoft Windows [Versión 10.0.19042.985], locale
es-CL)
[√] Android toolchain - develop for Android devices (Android SDK version 30.0.3)
[√] Chrome - develop for the web
[√] Android Studio
[√] VS Code (version 1.56.0)
[√] Connected device (2 available)
• No issues found!
Well, I see that you pop the screen right after you pushed it:
#override
Widget build(BuildContext context) {
return ListTile(
title: Text(title),
onTap: () {
// go to route ... Navigator.push(context, route)
Navigator.pushNamed(context, route);
// close the nav after navigating
Navigator.pop(context); // This will pop your last pushed route
});
}
Try to comment out the line with Navigator.pop(context);.
EDIT 1:
For having the drawer closed before you push a new route:
#override
Widget build(BuildContext context) {
return ListTile(
title: Text(title),
onTap: () {
// close the nav before navigating
Navigator.pop(context); // This will pop your last pushed
// go to route ... Navigator.push(context, route)
Navigator.pushNamed(context, route);
route
});
}
Why is it i cant load background image in my project? Unable to load asset: lib/assets/background.jpg
import 'package:flutter/material.dart';
Widget testWidget = new MediaQuery(
data: new MediaQueryData(), child: new MaterialApp(home: new MyApp()));
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("lib/assets/background.jpg"),
fit: BoxFit.cover,
),
),
child: null /* add child content here */,
),
);
}
}
file tree
pubspec.yaml
assets:
- lib/assets/background.jpg
Do not make3 folder under lib folder. Your structure for assets folder as per below.
And pubspecs.yaml
I will suggest to remove this code:
Widget testWidget = new MediaQuery(
data: new MediaQueryData(), child: new MaterialApp(home: new MyApp()));
Move assets folder to the root of the project and update the path in pubspec.yaml
assets:
- /assets/
Change MyApp to use MaterialApp and HomePage:
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: HomePage(),
);
}
}
Then move the background image code to the HomePage inside the Scaffold:
Scaffold(
body: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/background.jpg'),
fit: BoxFit.cover,
),
),
),
),
if your assets included into androin folder...try this
flutter:
assets:
-android/assests/directory/