你好,歡迎來到IOS教程網

 Ios教程網 >> IOS編程開發 >> IOS開發綜合 >> iOS中UIWebView的科學使用方法總結

iOS中UIWebView的科學使用方法總結

編輯:IOS開發綜合

眾所周知,沒有哪一個工具能像html/css那樣如此輕易的構建復雜的界面,為了保證良好的用戶體驗,有時我們可能會選擇使用html的方式來展示復雜度高,復用性低的界面,在iOS平台,選擇UIWebView是非常自然的,那麼我根據最近的一個iPad上的珠寶導購項目來向大家總結一下iOS平台結合HTML5使用UIWebView的小Tips。

1、加載本地html代碼

這段代碼加載了項目資源路徑下www目錄裡面的index.html文件

	NSString *path = [[NSBundle mainBundle]pathForResource:@"index" ofType:@"html" inDirectory:@"www"];
        NSURL *url = [NSURL fileURLWithPath:path];
        NSURLRequest *req = [NSURLRequest requestWithURL:url];
        [_webView loadRequest:req];


2、加載網絡html代碼

        NSString *fullURL = @"http://ruby-china.org/";
        NSURL *url = [NSURL URLWithString:fullURL];
        NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];
        [_webView loadRequest:requestObj];

3、原生代碼運行頁面裡面的js代碼

[self.webView stringByEvaluatingJavaScriptFromString:@"alert("Calling from native code");"];

4、響應式布局

對於針對html5平台的html頁面,一般都會在head裡面添加這樣的代碼,它能自適應不同尺寸和分辨率密度的屏幕

5、針對觸摸屏優化

這是一段非常神奇的js代碼,能夠讓你的頁面中所有標簽的跳轉,在觸摸屏上面的響應速度有一個質的飛躍!對於用戶體驗的提升,能使得html頁面最大化的近似原生應用。


{
    var touching_flag = false;

    $(document).on('touchstart', "a:not(.notouch):not([href='#'])", function () {
        if (!touching_flag) {
            touching_flag = true;
        }
        window.setTimeout(function () {
            touching_flag = false;
        }, 0);
        return false;
    });

    $(document).on('touchend', "a:not(.notouch):not([href='#'])", function () {
    	window.location.href = $(this).attr('href');
        touching_flag = false;
    });

}


6、對於提升用戶體驗非常有用的十個代碼片段

http://www.jquery4u.com/plugins/10-jquery-ipad-code-snippets-plugins/

  1. 上一頁:
  2. 下一頁:
蘋果刷機越獄教程| IOS教程問題解答| IOS技巧綜合| IOS7技巧| IOS8教程
Copyright © Ios教程網 All Rights Reserved