I'm working with flutter test. I want to test something after tap a widget but I don't know how to find the button. Because I custom it rather than use Icon or iconButton. Also, I can't find it according to its text because another widget has the same name. And also two InkWell widget as you can see. My basic test code is here.
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:grpc/grpc.dart';
import 'package:project/page/login.dart';
void main() {
testWidgets('login page test', (WidgetTester tester) async {
// Build our app and trigger a frame
await tester.pumpWidget(Login());
expect(find.text('login'), findsNWidgets(2));
expect(find.text('ID'), findsOneWidget);
expect(find.text('password'), findsOneWidget);
expect(find.text('end'), findsOneWidget);
// how to find my custom button
await tester.tap((find.byElementType(InkWell))); <- my question here
// test other things after tapping the button.
});
}
InkWell(
key: const Key("btnLogin"),
child: ElevatedButton(
onPressed: () {
_decrementCounter();
},
child: const Text(
" Login ",
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
),
),
Like this also we can do
await tester.tap(find.byKey(const Key('btnLogin')));
await tester.pump();
Instead of find.byElementType() use find.byType().
So your code will be like this:
await tester.tap((find.byType(InkWell)));
Like this you have to mention key (key: const Key("btnLogin"),)
ElevatedButton(
key: const Key("btnLogin"),
onPressed: () {
_decrementCounter();
},
child: const Text(
" Login ",
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
),
in Widget test
await tester.tap(find.byKey(const Key('btnLogin')));
await tester.pump();
give a key name to your inkwell button like this.
- in your login screen.
InkWell(
key: const Key("login"),
child: ElevatedButton(
onPressed: () {
},
child: const Text(
" Login ",
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white),
),
),
),
**- in your testing file**
var loginButton = find.byKey(const Key('login'));
await tester.tap(login);
Related
This question already has answers here:
Flutter (Dart) How to add copy to clipboard on tap to a app?
(5 answers)
Closed 8 months ago.
I have to copy data of a certian field to the clipboard when the textbutton.icon is pressed.How can I do that?
Try below code, refer setData and ClipboardData or you can be use clipboard package
import below library/package in your code
import 'package:flutter/services.dart';
Your Widget:
InkWell(
onTap: () {
Clipboard.setData(
ClipboardData(
text: "Your Copy text",
),
);
},
child: Text("Your Copy text"),
),
Have you tried googling?
First google result:
import 'package:flutter/services.dart';
onTap: () {
Clipboard.setData(ClipboardData(text: "your text"));
},
source: https://www.codegrepper.com/code-examples/dart/how+to+copy+text+to+clipboard+flutter
Please try below code
Using ClipBoard
// copy to clipboard
Future<void> _copyToClipboard() async {
await Clipboard.setData(ClipboardData(text: "Text to be copied"));
ScaffoldMessenger.of(context).showSnackBar(const SnackBar(
content: Text('Copied to clipboard'),
));
}
IconButton(
icon: const Icon(Icons.copy),
onPressed: _copyToClipboard,
),
// Get Data From System Clipboard
String _textValue = '';
void _getClipboard() async {
ClipboardData data = await Clipboard.getData(Clipboard.kTextPlain);
setState(() {
_textValue = data.text;
});
}
// or You can replace Clipboard.kTextPlain with text/plain to getData // from Clipboard.
ClipboardData data = await Clipboard.getData('text/plain');
Using Selectable Text
SelectableText(
"text to be copied" ?? "",
style: TextStyle(color: Colors.blue, fontWeight: FontWeight.bold, fontSize: 48),
textAlign: TextAlign.center,
toolbarOptions: ToolbarOptions(copy: true, selectAll: true),
),
In my flutter application I have a button for follow and unfollow a user.
buttonstate.isSelected && widget.user!.isFollowing == true
? ElevatedButton(
onPressed: () async {
await unfollowuser(widget.user!.id); //Api Call
},
child: Text(
'Following',
style: TextStyle(
color: Theme.of(context).disabledColor,
),
),
)
: ElevevatedButton(
onPressed: () async {
buttonstate.setButtonState(true);
await followuser(widget.user!.id); //Api Call
},
child: Text(
'Follow',
style: TextStyle(
color: Theme.of(context).accentColor,
),
),
),
My objective is whenever the button is pressed I want the Api call to happen as well as the state of the button should change from 'Follow' to 'Following'. Now the Api gets called, but the button wont change to 'following'. After the page is refreshed, button changes to 'following'. How can i manage state of the button using provider??
Ive created a provider for this purpose as follows
import 'package:flutter/material.dart';
class ButtonProvider with ChangeNotifier {
bool isSelected = false;
void setButtonState(bool value) {
isSelected = value;
notifyListeners();
}
bool? get buttondata {
return isSelected;
}
}
I am trying to create an android notification channel with flutter_local_notifications: ^5.0.0+4
Put it looks like it does not work as should be.
I wrote a code using getNotificationChannels to verify if the channel was created successfully
Please take a look to my code
Future<void> _getNotificationChannels() async {
await flutterLocalNotificationsPlugin.resolvePlatformSpecificImplementation<
AndroidFlutterLocalNotificationsPlugin>()?.createNotificationChannel(AndroidNotificationChannel(
'high_importance_channel', // id
'High Importance Notifications', // title
'This channel is used for important notifications', // description
importance: Importance.max,
));
final Widget notificationChannelsDialogContent =
await _getNotificationChannelsDialogContent();
await showDialog<void>(
context: context,
builder: (BuildContext context) => AlertDialog(
content: notificationChannelsDialogContent,
actions: <Widget>[
TextButton(
onPressed: () {
Navigator.of(context).pop();
},
child: const Text('OK'),
),
],
),
);
}
Future<Widget> _getNotificationChannelsDialogContent() async {
try {
final List<AndroidNotificationChannel>? channels =
await flutterLocalNotificationsPlugin
.resolvePlatformSpecificImplementation<
AndroidFlutterLocalNotificationsPlugin>()!
.getNotificationChannels();
return Container(
width: double.maxFinite,
child: ListView(
children: <Widget>[
const Text(
'Notifications Channels',
style: TextStyle(fontWeight: FontWeight.bold),
),
const Divider(color: Colors.black),
if (channels?.isEmpty ?? true)
const Text('No notification channels')
else
for (AndroidNotificationChannel channel in channels!)
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text('id: ${channel.id}\n'
'name: ${channel.name}\n'
'description: ${channel.description}\n'
'groupId: ${channel.groupId}\n'
'importance: ${channel.importance.value}\n'
'playSound: ${channel.playSound}\n'
'sound: ${channel.sound?.sound}\n'
'enableVibration: ${channel.enableVibration}\n'
'vibrationPattern: ${channel.vibrationPattern}\n'
'showBadge: ${channel.showBadge}\n'
'enableLights: ${channel.enableLights}\n'
'ledColor: ${channel.ledColor}\n'),
const Divider(color: Colors.black),
],
),
],
),
);
} on PlatformException catch (error) {
return Text(
'Error calling "getNotificationChannels"\n'
'code: ${error.code}\n'
'message: ${error.message}',
);
}
}
As you can see I am using createNotificationChannel to create a notifications channel then I am using getNotificationChannels to see if the channel was created successfully.
I am getting always "No notification channels" as a result in the dialog.
I do not know what is wrong with my code,
Thanks for your help
The problem was the Android version that I am using for testing,
Notification channels is a concept that is specific Android 8 or newer, which is why the API docs state that the method to create channels is only for those versions of Android
This project can be found here:https://github.com/Santos-Enoque/flutter_blog_app
So far I have this connected to firebase realtime database and it works well. I'm trying to add a like button to the Home page(lib/screens/home.dart) where all the posts are listed.
The Homepage displays the blog results using a Card with a ListTile. The trailing property of the ListTile card is already used so I'd like to use the leading property of the ListTile card to display a favourite icon which would increment a counter++ when tapped and also save the results to Firebase. Just like Facebook's like button.
Here's the code below:
child: Card(
child: ListTile(
title: ListTile(
onTap: (){
_incrementCounter();
},
leading: FittedBox(
fit: BoxFit.fitWidth,
child: Row(
children: <Widget>[
Icon(Icons.favorite),
Text(postsList[index].counter.toString()
),
],
),
),
title: Text(
postsList[index].title,
style: TextStyle(
fontSize: 16.0, fontWeight: FontWeight.bold),
),
trailing: Text(
timeago.format(DateTime.fromMillisecondsSinceEpoch(postsList[index].date)),
style: TextStyle(fontSize: 12.0, color: Colors.grey),
),
),
subtitle: Padding(
padding: const EdgeInsets.only(bottom: 14.0),
child: Text(postsList[index].body, style: TextStyle(fontSize: 14.0),),
),
),
),
Here's the _increment counter code:
try {
var ref = FirebaseDatabase.instance.reference().child('posts/{postId}/counter');
await ref.once().then((data) async => {
await ref.set(data.value + 1),
});
} catch (e) {
print(e.message);
}
}
![Home page of blog]https://photos.google.com/share/AF1QipMK6C-Wx2vZHHbE2jDMQsfYNnwl9OWK_5W8OKOfiIChcXt-gnWnCH7ba_EpyRnRAA?key=cGxkRkVSSk9PQTdtTXB0MzZBRDNHNUVzSGxlcDVB
The blog posts are displayed as cards as in the image ... I'm trying to add an icon on the left side of the card(leading) plus an incrementing value everytime someone taps the icon. Something like the like button on facebook. And also save the data to firebase realtime database.
Any help is much appreciated ... Thank you all!
I think what you may want to do is add this function to your onPressed. You will also need to set the text of the next to the icon equal to the new value read.
void like() async {
try {
var ref = FirebaseDatabase.instance.reference().child('path to likes for a post');
await ref.once().then((data) async => {
await ref.set(data.value + 1);
});
} catch (e) {
print(e.message);
}
}
Hope this helps.
P.S.- You may find this video of use: https://www.youtube.com/watch?v=l8_7RTRRmHo
Thanks to everyone who helped with this:
Code for UI:
leading: FittedBox(
fit: BoxFit.fitWidth,
child: Row(
children: <Widget>[
Icon(Icons.favorite),
Text(postsList[index].counter.toString()
),
],
),
),
Code for Function:
onTap: (){
_incrementCounter(postsList[index].key);
}
...
void _incrementCounter(key) async {
try {
var ref = FirebaseDatabase.instance.reference().child('posts/'+ key +'/counter');
await ref.once().then((data) async => {
await ref.set(data.value + 1),
});
} catch (e) {
print(e.message);
}
}
}
I have a CheckboxListTile and a widget in the title tag. How can I create a html text (text + url) to this widget?
My text is: 'Hello Click here!'
I tried this: flutter_html: ^0.10.4
with no luck
Thanks
Edit:
You can try link: ^1.1.0
import 'package:link/link.dart';
...
Link(
child: Text('This is a link to Flutter', style: TextStyle(
decoration: TextDecoration.underline, // add add underline in text
),),
url: 'https://google.com',
onError: _showErrorSnackBar,
),
void _showErrorSnackBar() {
Scaffold.of(context).showSnackBar(
SnackBar(
content: Text('Oops... the URL couldn\'t be opened!'),
),
);
}
...
Output:
Have you tried url_launcher,
RaisedButton(
onPressed: _launchURL,
child: Text('Text'),
),
_launchURL() async {
const url = 'https://flutter.dev';
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
You can also try linkify
linkify("Made by https://cretezy.com");
You could try flutter_linkify.
You need to replace Text with Linkify widget.
With this plugin you code might look like this:
Linkify(
onOpen: (link) => print("Clicked ${link.url}!"),
text: "Made by https://cretezy.com",
);