i have an issue about the text widget not being able to detect that there is a link.
later I will get a text response from the server as shown. the response is in the form of text as well as a link.
the problem is the text widget on flutter can't detect it. How do I make the link in the text detectable and clickable?
I have read and searched about this but could not find it. because most of the link text must be typed by yourself. while my problem the text is automatically there because it is the response from the server
can anyone help me find an answer?
Thank you in advance
Text widget does not automatically recognise links.
You can, however insert actions to text using the TextSpan widget and url_launcher, somewhat like this:
RichText(
text: TextSpan(
children: [
TextSpan(text: 'some text'),
TextSpan(
text: url,
style: new TextStyle(
color: Colors.blue,
decoration: TextDecoration.underline
),
recognizer: TapGestureRecognizer()
..onTap = () async {
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
},
),
]
),
)
You can wrap this into a class and make a small LinkText widget for yourself.
What flutter_linkify does is that it automatically detects URLs & email IDs in text and links them.
You can also do this using regex. For eg. for identifying url, you could have something like:
bool _isLink(String input) {
final matcher = new RegExp(
r"(http(s)?:\/\/.)?(www\.)?[-a-zA-Z0-9#:%._\+~#=]{2,256}\.[a-z]{2,6}\b([-a-zA-Z0-9#:%_\+.~#?&//=]*)");
return matcher.hasMatch(input);
}
You will have to, modify this a bit to get the substring and use that as url in text span!
Related
Please I need your help I have a mobile application, when am typing on the input fields, the keyboard covers the input fields and it doesn't scroll for user to input text. See below the code am talking about. Below is a sample could you tell where the issue is ? (Note this is a flutter app)
AppTextField(
controller: emailController,
focus: emailFocus,
textFieldType: TextFieldType.EMAIL,
decoration: inputDecoration(context, hint: appLocalization.translate('email')),
nextFocus: widget.phoneNumber != null ? null : passFocus,
errorThisFieldRequired: appLocalization.translate('field_Required'),
errorInvalidEmail: appLocalization.translate('email_Validation'),
maxLines: 1,
cursorColor: colorPrimary,
).paddingBottom(16),
return Scaffold(
resizeToAvoidBottomInset: **true**,
body: Container(
child: Stack(
children: [
Form(
This solution worked for me, by changing the value to true from my the code above. It was set to false.
N:B - I got the info from another thread. check the link some options there might also be helpful should incase any come across same issue.
Flutter Keyboard makes textfield hide
I use url_launcher package in my app for making a call like this:
IconButton(
onPressed: () {
UrlLauncher.launch('tel://${user.phoneNumber}');
},
icon: Icon(
Icons.phone,
color: Color(0XFF01d57f),
),
)
everything works fine in the simulator, but on real app when I have another call apps like Skype, android ask for default app for calling; and if user select Skype by mistake and press "Always use this" every time Skype open for him instead of default call app how can i avoid those third party apps or just reset settings each time user enter the app ?
I also try flutter_phone_direct_caller package but same thing happened :
IconButton(
onPressed: () async {
//set the number here
bool res =
await FlutterPhoneDirectCaller.callNumber(
user.phoneNumber);
},
icon: Icon(
Icons.phone,
color: Color(0XFF01d57f),
),
)
I'm using HTML widget from flutter_html library to show some articles fetched from some api and I want to align my text to the right (rtl language)
This my code
Html(
data: widget.article.postContent,
defaultTextStyle: TextStyle(
color: ThemeColors.white100,
),
),
I have tried to use Directionality widget as parent widget but it doesn't work.
add customTextAlign property with flutter TextAlign class properties to the widget like the below code
Html(
customTextAlign: (_) => TextAlign.right,
),
UPDATE:
after version 1.0.0
it should be like this
Html(
style: {
'html': Style(textAlign: TextAlign.right),
},
)
as mentioned by MSpeed
in this answer
It seems like the other answer might be out of date now. I had luck with this:
Html(
data: myData,
style: {
'html': Style(textAlign: TextAlign.center)
},
)
I'm developing WebView mobile application in Flutter and I would like to customize webview errors, because if customer will have his wifi turned off and he got "net::ERR_ADDRESS_UNREACHABLE", it's not so good. So i would like to change this page to some custom design and show something like "This application requires internet connection, you should turn your wifi on"..
Is something like this possible? I was searching in docs and found nothing.
Thanks a lot.
Not sure if we can modify the actual message shown from the webview itself, but there is a workaround that I have used.
You can use a Stack widget and show a custom message in a separate widget whenever the error occurs. A sample code is below.
Stack(
children: [
if (!controller.isError)
WebView(
javascriptMode: JavascriptMode.unrestricted,
initialUrl: "https://some-random-url.com",
onPageFinished: controller.onLoaded,
onWebResourceError: controller.onError,
),
if (controller.isLoading)
Center(
child: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(Colors.black),
),
),
if (controller.isError)
Center(
child: Padding(
padding: const EdgeInsets.only(left: 8.0, right: 8.0),
child: Text(
text: "Something went wrong, please try again",
),
),
)
],
),
The Controller object you see is a GetX controller which I use for state management, you are free to use whatever you like. The main action elements are
isError -> State variable which monitors if an error has occurred.
WebView.onWebResourceError -> Callback function called when a certain error occurs.
You can pass a function to this and this callback is only called when an error occurs. With this, you can then modify the state variable isError to be true, which will, in turn, hide the webview and show an error message at the center of the screen.
With this, you will have the error handling you are looking for.
PS: I know I am late for this answer, but I hope somebody else finds it useful.
Within a flutter application that has TextField or TextFormField the text can get duplicated upon first time data entry.
When first entering a keypress, within a field that already has text pre-filled, the text duplicates then your keypress is attached.
I am experiencing something that exhibits this behavior on my Samsung Galaxy S7, S8 and S9 (only devices I have to test with). This doesn't occur within the emulator (Galaxy Nexus9 and Pixel 2).
If I place a space at the end of the field, this problem doesn't happen, however, if I tap in middle of a pre filled field (using controller or initialValue) and press a key it does occur.
Here is a barebones source example:
class SampleTextFormPage extends StatefulWidget {
#override
State<StatefulWidget> createState() => new _SampleTextFormPage();
}
class _SampleTextFormPage extends State<SampleTextFormPage> {
final _scaffoldKey = new GlobalKey<ScaffoldState>();
TextEditingController _txtController;
#override
void initState() {
super.initState();
_txtController = TextEditingController(text:'Using Controller');
}
#override
Widget build(BuildContext context) { Scaffold scaffold = new Scaffold(
key: _scaffoldKey,
appBar: new AppBar(
title: new Text('Text Entry',
style: const TextStyle(
color: Colors.white)
),
backgroundColor: Colors.indigo
),
body: Column(children: [
//field 1
TextField(
autocorrect: false,
autofocus: true,
controller: _txtController,
),
//field 2
TextFormField(
autocorrect: false,
autofocus: true,
initialValue: 'Using initialValue',
)
])
);
return scaffold;
}
}
Note: I am on the latest release of flutter and I have reverted to multiple versions of Flutter (all the way to the first release that supports Dart 2) and this problem still exists.
As #DarkNeuron mentioned, it is a known Flutter issue on Samsung devices. There's no complete cure for it for now.
As of February 2020 it was determined the issue is connected with Samsung keyboard caching process and autocorrect. In the Flutter github possible temporary workaround proposed: use keyboardType: TextInputType.visiblePassword for all you text inputs. But there is a report it is not valid for at least Korean language. One another suggestion is to check for Samsung device and build accordingly:
keyboardType: samsungKeyboard ? TextInputType.visiblePassword : TextInputType.emailAddress,
autoFocus: false,
The part of the problem (duplicates on punctuation) fixed two weeks ago. But the main part of the problem is still observed.
More details you can find here: Flutter github.
I had same issue and fixed it with this simple temporary solution: just add to initialValue's end a space. Example:
initialValue: controller.text + ' ',