По какой-то причине я не могу заставить UIWebView "хорошо играть" с моими новыми изображениями Retina. Проблема, шаг за шагом:
Я загружаю серию файлов справки HTML из пакета. Мой код загружает разные файлы HTML, если это iPhone 4 (LWERetinaUtils
ниже - это класс утилиты, который я написал). Я прочитал в этом вопросе, что UIWebView не может работать автоматически -обнаружить индикатор @ 2x - и испытал это на собственном опыте, отсюда и такой подход.
if ([LWERetinaUtils isRetinaDisplay])
htmls = [NSArray arrayWithObjects:@"[email protected]",@"[email protected]",nil];
else
htmls = [NSArray arrayWithObjects:@"foo.html",@"bar.html",nil];
Единственное различие между содержимым [email protected]
и foo.html
состоит в том, что теги изображений относятся к изображениям с более высоким разрешением.
Затем я загружаю свой UIWebView следующим образом:
_webView = [[UIWebView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 320.0f, 375.0f)];
_webView.delegate = self;
[self _loadPageWithBundleFilename:self.filename];
[self.view addSubview:_webView];
_loadPageWithBundleFilename:
- это просто вспомогательный метод, который я написал, чтобы сообщить UIWebView о необходимости загрузки содержимого из файла.
Пока все хорошо, мой контент загружается по-разному между iPhone Simulator и iPhone 4 Simulator - и не так, как я ожидал.
Текст отображается точно такого же размера, но изображения Retina кажутся увеличенными (они выглядят пиксельными) и вылетают за правый край экрана.
Я пробовал:
_webView.scalesPageToFit = YES
свойство, и, конечно же, оно заставляло изображения выглядеть надлежащим образом (по крайней мере, без пикселов). Но тогда мой текст был крошечным (так как я был довольно сильно уменьшен в веб-представлении).
Кто-нибудь знает, как обойти такую проблему? Я видел несколько решений Javascript (вот так), но они кажутся просто" заменой изображений ", что я уже делал выше - так что это должно работать, нет ??
Наконец, в файлах HTML я имею в виду изображения:
<img src="[email protected]" border="0" title="Welcome!" class="title"/>
И CSS:
body{ margin:20pt; padding:10pt; line-height:38pt; font-size:24pt; text-align:left; background-color: transparent; font-family:Helvetica,sanserif; width:640pt;}
Ставлю в CSS тег ширины - вроде ничего не меняет.