When input some language that cannot input a word directly by English keyboard, like Chinese, Japanese. They use romanization to help.
For example, when input a word 你好 which is hello In English. You should input nihao .
And the result is that the words that is inputing is highlighted to indicate that you are typing the words currently.
Two images at the end, shows the effect. First is in native iOS, the highlight style is change the background color to light blue,
Second is in Flutter, the style is underscore.
I want to know in flutter, how to custom the style.
Thank you ！
native iOS flutter
Related
Kindly note that I have a Flutter App, that uses Arabic locale, however I'm using the TextDecoration.underline property for specific captions, but the underline stroke appears higher than supposed to, when using the Arabic locale only, as in the attached screenshot,
Please advise,
Thanks in advance,
Note:
This issue doesn't occur when using the English or French Locales.
I would like to make a hybrid app using Flutter. One particular kind of component I'm looking at sounds something like this:
A Chinese character like 家 (which means home) is shown
When an user clicks on the character, it can display its pronunciation (jia)
The user also has the option to click to play the pronunciation
The user can also choose to open a window where an animation of how the character is being written is played.
So for a sentence like: 蓝天是白云的家（literally translated as: The blue sky is the home of the white clouds）, each of these 7 characters can be individually clicked and users can choose to display / play pronunciation / show how they are written.
Normal static text won't be rich enough to display all these information. My current idea is to make every character a customized widget with such data embedded within.
This task can be quite huge if each Chinese character (there are approximately 5000 characters that are commonly used) has its own rich data format.
Any suggestions on how to approach this problem in an efficient manner in Flutter?
Thanks in advance!
There are a few ways to do this. Using widgets could definitely be an option, but that's probably going to cause you issues in the long run.
Let's break this into two parts:
1: Displaying the text
Instead of using widgets, I'd suggest using a RichText with many TextSpan children. You could create a custom class that accepts the string, splits it into characters, and puts each character in its own TextSpan. By using TextSpan.recognizer. You could then either use a TapGestureRecognizer with onTap to show the information when tapped if you don't need the position at which it was tapped, or onTapDown/onTapUp if you do (for example if you want to show a popup right where the click happened as opposed to something like a bottom sheet that comes up).
2: Showing the information
Because you're wanting to deal with a large amount of characters, I'd suggest not doing it all in code but instead handling the characters in some other sort of format that can easily be manipulated, for example JSON. That way you can do things like splitting the data it into blocks and loading them as needed, and/or getting them from a web server.
Your data could look something like:
{
"家": {
"pronunciation": "jia",
"audio": "path/to/sound.m4a",
"animation": "path/to/animation.gif"
},
...
}
You could theoretically even do things like start loading the pronunciation files when the character is first shown or when they click on it.
When the character is tapped, you could:
check if data in cache
load the data if needed from network/disk
open bottom sheet or popup displaying the pronunciation info + buttons for audio & drawing animation
Say I had text that the user was inputting into a big text box. I also want my app to be testing if any of the text inputted is in an array, and if it finds them then style these differently (For example highlight them wit ha yellow background). So if the phrases I was looking for were 'cake is great', 'people are awful' and 'scooters are the best', and the user wrote 'I really love my cake, cake is great' is it possible for flutter to see this text, and add a text style purely to the last part of the sentence, or otherwise style it differently?
How would I go about doing this?
Using substrings should do the trick, if anything else is trying to do something similar look here!
https://pusher.com/tutorials/styled-text-flutter#text-styling-with-the-text-widget
I'm developing a j2me application using Netbeans IDE and LWUIT library. I'm using Persian (RTL) language in my application using localization and showing them with bitmap font.
In order to wrap multiple line texts in a Form as Labels or in TextAreas. My problem is that they are breaking to multiple lines when they reach to the middle of screen width i.e they don’t fill one line till the end of the screen width and go to the next line. I set
maxwidth=Display.getInstance().getDisplayWidth());
Would you help me with this issue?
try using YourComponent.setPreferredW(Display.getInstance().getDisplayWidth());
When creating the text area set the columns number to a large value (100 or so).
In some languages like Hindi(India) where unicodes are used even though they are LTR , for that we can do TextArea.setUseStringWidth(true);
This will wrap the text according to the font glyphs of that language.
I am doing an application where I am trying to implement the arabic style of writing in textfield and textview here i have used a line:
[self.textfiled setBaseWritingDirection:UITextWritingDirectionRightToLeft];
but I am getting an warning: "method not found".
Please suggesst me some solution.
Have you tried entering Arabic text in the text field after setting the keyboard language to Arabic? I recall that it automatically sets the direction from right to left by detecting the character entered. You would not be required to call this method.