Vì một số lý do, tôi không thể có UIWebView để "phát đẹp" với hình ảnh Retina mới của tôi. Vấn đề, từng bước:Sử dụng hình ảnh Retina trong UIWebView cục bộ
Tôi đang tải một loạt tệp trợ giúp HTML ra khỏi nhóm. Mã của tôi tải các tệp HTML khác nhau nếu đó là một chiếc iPhone 4 (LWERetinaUtils bên dưới là một lớp util mà tôi đã viết). Tôi đã đọc in this question rằng không thể cho UIWebView tự động phát hiện chỉ báo @ 2x - và trải nghiệm cá nhân đó, do đó cách tiếp cận này.
if ([LWERetinaUtils isRetinaDisplay])
htmls = [NSArray arrayWithObjects:@"[email protected]",@"[email protected]",nil];
else
htmls = [NSArray arrayWithObjects:@"foo.html",@"bar.html",nil];
Sự khác biệt duy nhất giữa nội dung của [email protected] và foo.html là các thẻ hình ảnh tham khảo các hình ảnh có độ phân giải cao hơn.
Sau đó, tôi tải UIWebView của tôi như thế này:
_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: chỉ là một phương pháp helper tôi đã viết để nói với UIWebView để tải nội dung từ các tập tin.
Cho đến nay rất tốt, nội dung của tôi đang tải khác nhau giữa Trình mô phỏng iPhone và Trình mô phỏng iPhone 4 - chứ không phải cách tôi mong đợi.
Văn bản hiển thị chính xác cùng kích thước - nhưng hình ảnh võng mạc dường như được thu nhỏ (trông có vẻ pixelated) và chúng bay ra khỏi đầu bên phải của màn hình.
Tôi đã cố gắng:
_webView.scalesPageToFit = YES
bất động sản, và chắc chắn đủ, nó làm cho những hình ảnh xuất hiện một cách thích hợp (ít nhất là không bị hiện tượng pixel). Nhưng, sau đó văn bản của tôi là nhỏ (như tôi đã được khá xa thu nhỏ bằng cách xem web).
Có ai biết cách giải quyết vấn đề này không? Tôi đã thấy một vài giải pháp Javascript (like this), nhưng chúng dường như chỉ là "trao đổi hình ảnh", đó là những gì tôi đã làm ở trên - vì vậy nó sẽ hoạt động, không ??
Cuối cùng, trong các tập tin HTML, đây là cách tôi đề cập đến những hình ảnh:
<img src="[email protected]" border="0" title="Welcome!" class="title"/>
Và CSS:
body{ margin:20pt; padding:10pt; line-height:38pt; font-size:24pt; text-align:left; background-color: transparent; font-family:Helvetica,sanserif; width:640pt;}
tôi đặt thẻ rộng trong CSS - nó dường như không thay đổi gì cả.
Nó sẽ giúp thấy một đoạn mã HTML của bạn. Cách bạn thiết lập UIWebView không quan trọng đối với việc chia tỷ lệ hình ảnh. Đó là tất cả trong HTML/CSS/JS. – Mike
Mike, được thêm vào theo yêu cầu của bạn- – makdad
Có lẽ câu trả lời của tôi cho một câu hỏi tương tự là thú vị http://stackoverflow.com/questions/3724058/uiwebview-and-iphone-4-retina-display/7741453#7741453. Nó sử dụng Javascript để tải hình ảnh thu nhỏ và thiết lập chiều rộng đúng và đường nối làm việc tốt với hình ảnh địa phương ít nhất. –