I am very new to iOS development and have inherited some code. I have come across this:
htmlString = [NSString stringWithFormat:@"<html><head></head><style type=\"text/css\">body h1{font-family:Helvetica Neue;font-weight:bold;font-size: 25px;background-image: -webkit-gradient(linear,left top, left bottom,from(white),to(CCFF00));-webkit-background-clip:text;-webkit-text-fill-color: transparent;}h1:after{ text-shadow:5px 2px 2px #000; content:\"%@\"; color:#000; position:absolute; left:-2px;z-index:-1 }</style><body><h1 style=\"\">%@</h1></body></html>",[loginValueClass sharedloginValueClass].userName,[loginValueClass sharedloginValueClass].userName];
web1.opaque = NO;
web1.backgroundColor=[UIColor clearColor];
web1.userInteractionEnabled = FALSE;
[web1 loadHTMLString:htmlString baseURL:nil];
Where web1 is of type UIWebView.
It produces some styled text with a gradient. However, it appears blurry on retina screens. It also has a noticeable delay when loading the screen.
My question is, is this really the best way to create such styled text, and if so, how do I solve the blurring issue on retina screens?
It’s blurry on Retina displays because
-webkit-background-clip:textdoesn’t seem to take the display’s resolution into consideration, so the clipping is done at a lower resolution.UIWebViewsonly make sense if you have texts with several different styles, e.g. a few words in red, a few words on a larger font size etc.For simple texts, a
UILabelis MUCH more efficient, and can be styled (shadows etc.) reasonably well. You can find examples here: