Issue
I’m trying to open link when tapped on ListWheelScrollView, but it doesn’t work. It doesn’t even enter the OnTap
import 'package:flutter/material.dart';
import 'package:string_validator/string_validator.dart';
import 'package:url_launcher/url_launcher.dart';
class News extends StatefulWidget {
final Map news;
@override
_NewsState createState() => _NewsState();
const News({Key key, this.news}) : super(key: key);
}
class _NewsState extends State<News> {
Map test;
double textPadding = 290;
// ignore: non_constant_identifier_names
@override
void initState() {
super.initState();
}
launchURL(String url) async {
if (await canLaunch(url)) {
await launch(url, forceWebView: true);
} else {
throw 'Could not launch $url';
}
}
@override
Widget build(BuildContext context) {
test = (ModalRoute.of(context).settings.arguments);
var fixedTest = test['data'].news4today;
checkUrls() {
for (int i = 0; i < fixedTest.length; i++) {
if (fixedTest[i]['urlToImage'] == null ||
!isURL(fixedTest[i]['urlToImage'])) {
fixedTest[i]['urlToImage'] =
'https://i.pinimg.com/originals/8a/eb/d8/8aebd875fbddd22bf3971c3a7159bdc7.png';
}
if (fixedTest[i]['url'] == null || !isURL(fixedTest[i]['url'])) {
fixedTest[i]['url'] = 'https://google.com';
}
}
}
checkUrls();
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
title: Center(child: Text('News')),
backgroundColor: Colors.deepPurpleAccent,
),
body: ListWheelScrollView.useDelegate(
itemExtent: 400,
diameterRatio: 9,
squeeze: 1.2,
physics: BouncingScrollPhysics(),
onSelectedItemChanged: (index) {
// debugPrint(index.toString());
},
childDelegate: ListWheelChildBuilderDelegate(
childCount: 100,
builder: (context, index) => Container(
child: Stack(
alignment: Alignment.topCenter,
children: <Widget>[
Material(
child: InkWell(
onDoubleTap: () {
launchURL(fixedTest[index]['urlToImage']);
},
child: Container(
height: 353.0,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.scaleDown,
alignment: FractionalOffset.center,
image: NetworkImage(
fixedTest[index]['urlToImage'])),
),
),
),
),
Container(
margin: EdgeInsets.only(top: 285),
child: Padding(
padding: const EdgeInsets.all(10),
child: SizedBox(
child: Text(
fixedTest[index]['title'],
style: TextStyle(fontSize: 16),
maxLines: 4,
textAlign: TextAlign.center,
)),
),
decoration: BoxDecoration(
color: Colors.purple[100],
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.8),
spreadRadius: 1,
blurRadius: 3,
offset: Offset(1, 1),
),
],
),
)
],
),
))));
}
}
I was trying to remove Containers with Ink, but if I’ll do that, it will ruin the app because of the text margin. Tried onDoubleTap too.
Solution
Instead of using inkwell you should use the RichText widget for tap-able text. Below is the code for the same. Using regular text and inkwell is not a good practice specially because if you want to add a regular text and a link right after it you will have to use Row widget and if the links goes to next next line it won’t look as expected.
import 'package:flutter/gestures.dart';
new RichText(
text: new TextSpan(text: 'Non touchable. ', children: [
new TextSpan(
text: 'Tap here.',
recognizer: new TapGestureRecognizer()..onTap = () => print('Tap Here onTap'),
)
]),
);
About your error, instead of yor launchURL function, try printing something to know if the double tap gesture is recognized or not. If you are getting the print statement on double tap, then its an error in your launchURL function.
Answered By – Sarvesh Dalvi
Answer Checked By – Mildred Charles (FlutterFixes Admin)