Drawn text highlighting. Core text? Something other? - ios

I want to draw highlighted parts of text, but I haven't any ideas, how can I do it.
Result, which I want:
Caption on image is one attributed string, where I'm finding hashtags and drawing it in blue color. Nickname in header - one simple NSString. I want to show rects, and text, which user wants to find. Have you any ideas, how I can find CGRects for NSRanges in my drawn string?
PS: I want to detect coordinate of last character for other image works.

Related

Can I put a UIButton or UITextField or UITextView between the texts in swift

Can I put a UIButton or UITextField or UITextView between the texts in Swift
examples:
"What is your **[UITextField]** about downloading free music files from the Internet?**[UIButton]**"
"What is your
**[UITextField]** about
downloading free
music files from the
Internet?**[UIButton]**"
Like "example2", the layout may change depending on the situation.
Not a particularly easy task. You can use attributed text to stylize a word and make it "tappable" (like a hyperlink on a webpage), but that wouldn't solve the issue of embedding an editable text field in the string.
One approach would be to embed "placeholder" text in your string, then find the bounding box for that word and overlay a textfield or button. You'd have to be sure to account for things like word wrap, and it would take some experimentation to get the widths right.
So, you might set the text of your label to:
What is your UITextFieldGoesHere about downloading free music files from the Internet? UIButtonHere
Then use code to find the bounding box / rect of UITextFieldGoesHere and position a text field on top of that, so it covers the word and looks like it is inline. Same thing with the UIButtonHere.
If your button might be simply OK, and you don't want it wide with left-right padding, change that placeholder in your string to something like OKB ... just make sure it is unique so you can find it.
Lots of examples out there for finding the bounding box / rect of a word in a label... use Google (or your favorite search engine) to search for:
uilabel find bounding box of specific word

Slight FROWNING face unicode in iOS

I want to display slightly FROWNING face in my UILabel and the unicode whihc i am using is \u2639 but that's displaying white frowny face but i needed the yellow one. I checked everywhere but its the same unicode everywhere. could somebody tell me what is the unicode for yellow frowning face?
Edit - Attached is the screenshot for which i am looking for unicode which should be the one which i posted above but that is giving me white frowning face not the yellow one.
The slightly frowny face is U+1F641.
However, let's return to your original question. You are setting the label's text to "\u{2639}" and you are seeing the white frowny face.
The solution is to specify the variant of this glyph, like this: "\u{2639}\u{FE0F}". If you set the label's text to that, you will see the yellow frowny face.
(To understand why that is and what the variation selector means, see https://unicode.org/reports/tr51/#Emoji_Variation_Sequences. Basically, this unicode codepoint falls in the older text area, so if you want the newer emoji variant, you have to ask for it.)
But an even simpler solution is: don't use codepoint values at all! Swift strings are unicode. Just include the emoji directly in your string. Set the label's text to "☹️"! For example:
self.label.text = "☹️"
That way, you will see the emoji you specified in the string.

NSAttributedString: Strikethrough text with replacement text above it

I am trying to draw an NSAttributedString (actually, a constructed NSMutableAttributedString) where the "original" text has been struck and replacement text inserted above it (I'm trying to replicate the look/feel of an Ancient Greek manuscript).
My technique is a combination of NSBaselineOffsetAttributeName with NSKernAttributeName, but it appears that using a negative value for NSKernAttributeName "wipes away" the strikethrough of the text, even if the characters don't overlap.
If I put an extra space after the "A" character (in the original text), the "A" gets the strikethrough, but the "EI" is also offset to the right. So, it appears that the offset/kerning of the "EI" text affects how much of the strikethrough actually occurs.
Here's what I'd like to reproduce (I don't care about the angle; it's not about a picture-perfect reproduction; just the gist):
Here's what is currently happening:
This is when I add an extra space after the strikethrough:
So, the only other thing I can think of would be to render a separate NSAttributedString in the correct place, separate from the current one, but I have no idea how to calculate the location of a specific character in an NSAttributedString when it's drawn. I'm drawing to a PDF, not to any on-screen control like a UILabel. Alternatively, I could draw the "strikethrough" myself as a line, but that seems to still require knowing the coordinates for the text in question, which is calculated on-the-fly, and I hope to use this method to reproduce a large sample of ancient texts, which means doing it by hand just isn't a good answer here.
Anything I'm missing, or any out-of-the-box ideas to try?

Karaoke-like progress highlight for iOS

I would like to implement karaoke-like progress highlight for iOS.
I know I could use NSAttributedString and highlight the text character by character. However, I would like the highlight to progress pixel by pixel, not character by character.
Any ideas?
P.S. No need for sample code, just point me to the right direction.
Here is an example:
I can't think of any automatic way to do that. There would be several problems to solve. It would be pretty hard, I think.
The hardest would probably be figuring out the pixel position of each word so you can pace the coloring to match the timing within the music. With text and attributed layout, you could probably get the text engine to give you the boundaries of each word and then apply the color attribute to each word as it's spoken/sung. You'd have to have data about the time offset for the beginning and end of each word's being sung.
You might have to use Core Text to get layout information about the bounding rectangles of each word.
Once you get that you could build a path (UIBezierPath or CGPath; they're pretty interchangeable) that follows the flow of the text, and then install that path in to a shape layer. You could then make the text transparent, make the shape layer a colored background that shows through, and animate the shape layer's strokeStart and/or strokeEnd properties to make it fill the text. You might need to do it word by word with a short animation that interpolates between one word and the next to get the timing right.
You probably want to have a look at Core Text, which is the lower level framework used for laying out text, using this you can obtain necessary paths that you need to render said effect (I suggest starting from answers similar to this)
There are plenty of answers for alternative, perhaps simpler answers, for example character by character or word-by-word, which may be easier to implement.

How to obtain plain 'globe' Unicode character

If you include Unicode characters in an NSString, a lot of them will take on the color set for that text - they're just regular glyphs for that font so they're displayed like any other character. But there are some Unicode characters that are colored, for example GLOBE WITH MERIDIANS which is a blue gradient with shadows. But I have seen this same glyph elsewhere that's a simple black outline without a shadow, for example in the iOS keyboard. I would like to use that glyph, but without the adornments, and without having to create and use an image. I wondered if a different font would render it in a different format, and while iOSFonts.com does show different styles (bolder, italics), they're all blue. Is it possible to get the simple plain version?
Surely it is possible, because that appears to be exactly what Apple has implemented with a Tip. Notice the globe is the exact same color as the text and it's included in the string along with all the other characters. Surely that's not a UIImage?
Character in different fonts:
EDIT: The solution provided in the linked question doesn't work for this character, as the variant character appears to be the exact same as the original - blue with shadows.
Unfortunately, iOS doesn't have a monochrome globe symbol you can use; the only built-in font that includes U+1F310 GLOBE WITH MERIDIANS is Apple Color Emoji.
If you really want a font that renders this character as a simple black outline, you could package a copy of Symbola (downloadable here) into your app.
Alternatively, you could make a bitmap image with the icon you want and use NSTextAttachment to put it into an attributed string. Apple is likely doing something along these lines, as many of their Tips include symbols that are definitely not Unicode characters:

Resources