React native text issue - reactjs

I was just creating app calculate user amount with some and display into text.Issue I facing when user amount is too long the result in the text splits like for example result amount is like Rs 7004505400089090760
it display in Text like Rs 70
045054000890760 splits amount like this i have to show in single in react native.guys pls help me. I have tried PixelRatio also if there is any possible to reduce size dynamically in react native?

The most sophisticated approach in case of amount would be to round this off for user experience and from the perspective of shortening it , you would have to reduce the font size of the text and one more way to cut the text in an elegant manner would be using http://facebook.github.io/react-native/releases/0.46/docs/text.html#ellipsizemode
this would just add '...' in place to let user know that text is truncated due to space.

Related

React-Simple-Map not scaling / Map is very small

I am attempting to create an interactive map of my home country using react-simple-maps, I am facing an issue where the map I am rendering in is extremely small, I have tried using height/width and scale but I cannot seem to get the map to render larger than scale(8).
Minimum useable code recreation:
https://codesandbox.io/s/zoom-controls-forked-g47m1?file=/src/MapChart.js
I edited your code, you can check solution here.
The problem vas that scale property in your JSON map data was too small.
If you want to make your map even more bigger change scale prop in ComposableMap.

Dynamic formatting of phone number in cn1

Are there any classes in cn1 similar to Android's PhoneNumberFormattingTextWatcher ?
I have a textfield for a phone number input. While user types in the phone number, I want it dynamically modify to "(123)456-7890" format. In general, this code will work https://stackoverflow.com/a/5114914/8921111 . But I need a real-time modifying.
Thank you.
No. You can use a DataChangeListener and dynamically edit the input to force a specific mask but that isn't ideal...
A simpler solution would be to use separate text fields for each editable portion and move the input between those entries. You can automatically move the cursor between the fields when one is filled up. See the developer guide section that covers masking here: https://www.codenameone.com/developer-guide.html#_masking

Scanning through camera against a bank of 10 images

I building an app that can use an iPad camera to scan for particular images. There will be a bank of 10 images that will be matched against, and when there is a match on one I need to navigate the app to a specific screen.
I guess you can compare this to a QR scanner, but without QR codes.
Example of one of the images to scan is:
https://imgur.com/a/lhWv8ny
Trouble is, I'm struggling to come up with a solution to scan the images. The other parts, no issue.
I've tried pattern markers with a-frame, I've done a load of research but can't find anything concrete at the moment.
Any direction will greatly be appreciated.
Maybe try to import some machine-learning library and if it's text only extract the text and match it to a dictionary:
https://github.com/zsajjad/react-native-text-detector
Or you could match for similar images with opencv:
Checking images for similarity with OpenCV
https://github.com/brainhubeu/react-native-opencv-tutorial

Render part of page to file

How can I make InDesign render a region of a page, as it would be rendered when exporting the whole file?
I know I can render a PageItem using the exportFile function, but this will ignore any other PageItems sharing the same region.
My current solution is to make a new document the size of the region of interest, with a copy of each PageItem whose coordinates fall into that region. It’s very inelegant, and it seems it cannot be done without the user seeing windows meaningless to them come and go.
Another approach I can think of is to export the whole spread containing the region, then crop the resulting file using something like ImageMagick. But I’d still prefer to be able to render only the region I need, if possible.
You can open the InDesing document without showing its UI as well.
app.open(filepath, false);
and while closing the doc, simple use
doc.close(SaveOptions.NO);
You anyways don't need to save that doc on disk.
This will let you have the document open without showing its UI at all.
I did something like this recently. Here are my steps:
duplicate all spread items and group them
make a frame with a proper size/position
cut and paste the group into this frame
export the frame as PNG
If you need another region on this spread you don't need to repeat all the steps, you can change size and position of the frame and to export it again.
There is a limitation: master page items will be omitted.

Firefox returns blank $viewValue when type="number" with space in field

I'm trying to setup a credit card entry field, and I need to be able to separate the digit-groups with a space. But on a mobile device, I want the number keyboard to appear, so I'm using input[type="number"] instead of just input[type="text"].
Currently, when I test on Chrome it's working. The $viewValue appearing in the directive for the credit card field shows the 16-digit number (Angular even auto-removes the spaces because of number type field).
But in Firefox, as soon as you type a space, $viewValue returns as "" (even though the field value is "5555 5555 5555 4444").
Is there any way to make this work as expected?
Wow Maybe this a serious Mozilla Bug, with no solution for now, then you may apply other ways to resolve this.
Use mask (lose number on mobile): Try Plugins, library like this http://digitalbush.com/projects/masked-input-plugin/ , the bad user loses the PAD NUMBER on mobile devices.
To keep input number (complex only for fun): Make a input type hidden, then when the user type on number field, fill the hidden input with the value.
Use text field (best way): yes number is the new era on HTML5, but users don't care that for now, yeah show only numbers with the pad (like most apps) is awesome, now ask is really necesary?
Dynamic Form JS: verify the browser version, if Wild Mozilla appears, change type number to type text ;)
Good luck !!
best regards from http://elporfirio.com

Resources