I'm new to iPhone development, and I have a question on how to create a view for my application.
The view should display a problem (using formatted/syntax highlighted text), and multiple possible answers. The user should be able to click on an answer to validate it.
Currently, I am trying to use a UITableView embedding UIWebView as contentView. That allows me to display formatted text easily.
The problem is that it is a real pain to compute and adjust the height of the cells. I have to preload the webview, call sizeToFit, get its height, and update the cell accordingly. This process should be done for the problem and the answers (as they are HTML formatted text too).
It's such a pain that I am planning to switch to something else. I thought using only a big UIWebView and design everything in HTML. But I looked at some articles describing how to communicate between the HTML page and the ObjectiveC code. This seems to involve some awful tricks too...
So... that's it, I don't really know what I should do.
I guess some of you dealt with such things before, and would provide some greatly appreciated tips :)
The catch here is that the iPhone API does not yet support NSAttributedString so you can't just set the text to appear as you would like in a textview.
I saw one work around which essentially used individual UILabels to represent each attribute run. (Can't find the link now.) They used NSString UIKit extensions to calculate the position of the strings on the view and then used that to position the labels.
Another work around would be to draw the strings with their attributes to a UIImage and then just display the image. That would be the easiest solution I think.
In either case your going to have to basically recreate the data structure of an attributed string.
NSAttributedString does a lot of work for us. We really miss it when it is gone.
Related
I'd like different words in a UILabel to be different colors. Does this mean each word will need to be a different UILabel? I'm guessing yes, though sure would be nice to just put color codes in the label somehow, you know? I guess I'm a bit spoiled by text markup in HTML.
There is no proper UIRichTextView in iOS. It's high on my wish-list for iOS 6 (and there's some reason to believe we may get it then due to the release of Pages).
Your options are to use multiple UILabel views, NSString UIKit Additions, Core Text, UIWebView, or one of a few third-party frameworks such as:
NSAttributedString-Additions-for-HTML
CoreTextWrapper
OHAttributedLabel
OmniUI
All of the current solutions have different problems. The most common problem is that it's hard to get select and copy functionality to work with rich text unless you use a web view. Web views are incredibly annoying because they're asynchronous and you have to do a lot of your interactions in JavaScript.
I wish there were a better answer.
(Obligatory shilling: This topic is covered in depth in Chapter 18 of iOS 5 Programming Pushing the Limits.)
UILabel doesn't support segmented formatting (the entire thing can only have one format).
Have a look at OHAttributedLabel, which does what you want.
As far as I'm aware you'd need to have separate labels for each different coloured word. Depending what you're trying to do you may be able to make use of myLabel.textColor to change the colour of the periodically or on events etc.
What is the best way to display lots of RichText (HTML formatted)
At the moment I'm working on an app for a forum. As you'd expect the posts on the site have lots of HTML formatting, lists, images bold text, colored text, etc...
Now there are several options I can think of (non of them ideal, please if you think of any other options post them in the comments):
Custom Cells using NSAttributedString+HTML + DTAttributedTextView for each post?
Problems: I used the NSAttributedString+HTML categories in the app elsewhere and it was less then ideal, creating an NSAttributedString seems to be quite expensive (slow) even in small amounts.
For 10+ posts each of which may be the length of an entire article would be awful + although DTAttributedTextView supports the IMG html tag (an most tags) it doesn't support remote loading of images unless you specify their width and height in the img tag. And for a forum where an IMG tag could be a smiley (10*10) or a screenshot (640*960) there's no way to predict that.
(Since writing this NSAttributedString+HTML, which is now renamed DTCoreText, has added full support for <img> tags and improved greatly!)
Custom Cells with a UIWebView in them for each post?
This one I considered for quite a while, however when reading this blog post I realised a problem that would cause, Smooth scrolling. The idea of having a native application for a site is that it is better then using a simple UIWebView to view the sites mobile theme. If the app lags and is jerky while scrolling that is worse not better (also as I need to display images hiding the webview's like he suggests wouldn't work). Also UIWebView's need to be created on the main thread or they break.
Back to the UIWebView?
Annoyingly besides doing a pathetic cheat, (like in the iFans app) where you only display text and then if they click it a UIWebView loads with all the nice images etc..., the only option left seems to be to do what I think the TapaTalk app does and have the entire thread view as a UIWebView. This isn't too bad as it will probably have quite good performance and will allow me to possibly add user controlled themes etc.. but I find the idea of using a UIWebView in a websites native app repulsive.
Does anyone have any experience creating web powered app, like maybe a facebook client, forum app, or new site app which had to display content from the site (I don't really count a twitter client as it only has to deal with text & links in small amounts per post). Or any ideas on the best way to display RichText content in an iOS app?
Any idea's would have to deal with the lot:
Multi Coloured Text.
Right, Left & Center aligned text.
Images (of variable size).
Bold text.
Text of different sizes & fonts.
Underlines text.
YouTube Videos.
HTML tables.
Just in case the actual question wasn't very clear in all of that I'll sum it up:
"What is the best way to display lots of RichText (HTML formatted) content for a forum client app"
So if I am reading this right, you want the forum posts of a given topic to be cells of a UITableView and the cells need rich formatting?
Assuming this is correct, I imagine each post will take up a lot of the screen (large cell height). In this case, having a UIWebView as a subview might not be as bad performance-wise as you might think. UITableView reuses cells so really only the visible cells need be loaded into memory.
I'm also assuming you are able to access the forum via an API, right? In which case, you should be able to pre-load data immediately prior to loading the view and the UIWebViews will only be used for formatting. You can even load a CSS file from your app bundle when you loadHTMLString into your UIWebView so you're not loading that from a server every time.
All that being said, if you did have a lot of concurrently visible cells it might be a different story and I'd maybe consider only showing plain text in the UITableView index and displaying the rich formatting only when the user taps the cell to view the single post. This might also be better from a design standpoint as having a ton of differently formatted cells on screen could potentially end up looking a bit sloppy.
Also, this may be obvious (especially since you seem to be both performance and design conscious) but please don't use UIWebView for UI controls. Any time I see a UIWebView tab bar or fake navigation bar I cringe (ack, Netflix). For formatting though, a lot times it's the only way to fly if you're loading a lot of dynamic content from a server.
NSAttributedString+HTML already supports lazy loading of images. See the Demo that shows how to do that. It's reasonably fast but you want to hold of parsing the HTML for content that is not on screen.
It mostly depends on what UI you want to achieve. NSAS+HTML is meant for situations where you control the quality of the HTML (i.e. because you generate it yourself). There it affords you with an unprecedented level of control over the view hierarchy because you can embed your own custom views to show images.
In other cases where you cannot be sure about the quality of the HTML you have to use UIWebView and work around all of it's limitations, one being that it takes enormous amounts of RAM and it slow to show the contents. Also UIWebView is not thread-safe (because WebKit is not).
I am pretty new to iPhone development and currently working on an application which includes a view that performs a simple numerical calculation. In particular, the user enters 3 or 4 values into text fields and the view displays the result. Something along the lines of http://www.moneychimp.com/calculator/compound_interest_calculator.htm
What is the nicest way to achieve this? I am currently using simple UITextFields and a UILabel for the result but it doesn't look nice or "native-like". What UI object would be best to use?
Thank you!
It's entirely up to you. You're using the right classes for actual input- it comes down to how you choose to style those classes. I'd suggest looking at the documentation for UIView and CALayer (youView.layer, and include QuartzCore framework in your project).
A good start might be to choose a color scheme, a background for your app, and the look and feel you're shooting for- this will inform your styling. Try looking for apps that you think are elegant and attractive, and boil down what they do and what you like about them.
I'd say;
use a grouped table style (with the white tables with round corners on a blueish striped background)
embed settings values directly in the cell (aligned to the right) as much as possible
you can show a relevant keyboard (text, numbers) or picker view to let the user pick values, directly when they tap the cell. Use sliders and switches where relevant.
You may want to take a look at http://www.inappsettingskit.com/, we are currently investigating it for the same purpose and it seems to do the job
You can use either a UISlider or a UIPickerView if some of your values have limits.
You can use UISwitch for toggles.
You can also switch the default keyboard for your textfields to be numeric.
Other than that you seem to be on the right track.
Also, sometimes putting a view inside a scrollview makes things seem cooler even if its only one page. The auto bounce on scrollviews is kind of cool.
This is a question for iPhone development and I'm hopin someone can point me to the right direction on how i should go about implementing this.
I am trying to write a chat application that supports emoticons/smileys. Where the smiley/emoticon images are stored can be figured out later. I think few iphone applications out there are already doing this (i.e. skype + ebuddy(?)) but not sure what method they went for.
After searching around, there seems to be a few ways of doing this (i think):
bubble chat style which has been discussed before. UITableViewController with custom UITableViewCell. For emoticons, might have to do a whole bunch of calculations to determine where to stick a UIImageView for each emoticon.
Use UIWebView as the whole "window". Style it to look like bubble chat. Takes away any manual calculations on image smiley placements.
I have no idea what the performance is like for each of these two methods, how complex it can get etc, so any comments and guidance will help for sure. Cheers
If you use custom UITableViewCell, then I'd probably implement drawRect: instead of adding labels and images. One will probably take as long to implement as the other, but it will perform much better.
The UIWebView might be worth a short, although you will have to make sure that everything looks right there, too. Instead of using one big web page, I suggest simply throwing in a web view into each table view cell.
Personally I prefer the first approach, measuring and layout of text is not too complicated, but then I've never been the ultimate HTML guru.
I agree with #Eiko on making custom UITableViewCells, especially using drawRect instead of adding labels, images, etc.
If you used a UIWebView how would you handle updating it? A complete reload each time new text is sent? That seems like it will be a cause of issues. Once you get a long conversation reloading the entire UIWebView's contents will cause some flickering which isn't acceptable in my opinion. Also using a UIWebView would require you to have 2 complete copies of each conversation in memory. 1 as your backend data and 1 as the HTML. Where using a UITableView you have your backend data, and only enough of that will be duplicated that can fill 1 screen at a time.
I would like to have a UITextField or UITextView in where as I do some input, alternatives will appear something similar to when you type an address in Mail Application, alternatives appear down and is possible tap them so get a better input user interface.(since there is no need to type the complete word or address or phone number)
I do know how to fetch data from Address Book framework, also how to input text in UITextField/UITextView and its delegates but I don't know what kind of structure to use for fetching and showing data as the user do his/her input.
I know basic CoreData if this matters,
I hope I can get some help.
UPDATE (2010/3/10):
I don't have problem make a native-like GUI but I am asking about the algorithm, does any body knows what kind algorithm is best for this thing? maybe some binary tree?
Or should I just fetch data from coredata everytime?
Thanks
Ignacio
UPDATE (2010/03/28):
I've been very busy these days, so I have not tried UISearchResults but it seems fine to me. BUT I wonder was there a necessity of deletion of the wining answer? I don't think is fair my reputation went down and couldn't see the winning answer. ;(
You don't need some advanced algorithm to do this kind of thing... if you want to search the address book, then you can do so each time the user types in a character (or however frequent you need to seach). To do this, just take a look at the UISearchDisplayController class. I learned how to do almost the exact thing by looking at Apple's TableSearch sample app.
That app searches a list of objects using different fields (All, Device, Desktop, Portable)... so you could adapt it to Address Book fields (First Name, Last Name, Address...). The only thing you need to change is the search within the Address Book. I don't know exactly what your requirements ask for but this should be what you need to get it done. If you have any trouble with the code let me know... but this example really helped me, so hopefully it works for you.
I was looking for the same thing a while ago. Something that people kept suggesting was the Three20 project (google it).
For my needs this was overkill because it requires the whole project to build and I didn't want the whole project. Plus it's more fun to try it yourself :)
I ended up starting from scratch and making my own:
I started out with a subclass of a UIScrollView to contain the different controls. I subclassed a UITextField and overrided "editingRectForBounds" to support multiple lines. The bit where the contacts are displayed is just a UITableView with a background color of:
[UIColor colorWithRed:0.92 green:0.92 blue:0.92 alpha:1];
And separator color:
[UIColor colorWithWhite:0.85 alpha:1];
This and the use of a shadow makes it looks like it's sunken slightly under the UITextField. I create the shadow with a custom UIView, loading it once and hiding it when required, but it works just as well with an image.
Finally, I made the blue pill shapes with a custom UIView which can intercept "touchesBegan" to know when they should change color.
Adding them is a simple matter of calculating where they need to go and using:
[myTextField addSubview:myBlueView];
Hope that helps!