iOS應用開發(fā)5分段控件和WEB視圖

1、2021/8/61使用高級界面對象和視圖青島濱海學院信息工程學院計算機教研室崔守良青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/62 本節(jié)教學內(nèi)容：如何使用分段控件（按鈕欄）通過開關輸入布爾值的方式如何在應用程序中包含Web內(nèi)容使用可滾動的視圖克服屏幕的局限性青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/63 1、開關UISwitch, 類似于傳統(tǒng)的物理開關，使用其ValueChanged事件來檢測開關切換，通過屬性on或?qū)嵗椒╥sOn來獲取當前值。2、分段控件UISegmentedControl，監(jiān)視ValueChanged事件，通過se

2、lectedSegmentIndex判斷當前選擇的按鈕，返回當前選定按鈕的編號，實例方法titleForSegmentAtIndex來獲得每個分段的標題3、Web視圖UIView，可以看作是沒有邊框的Safari窗口，使用NSURL、NSURLRequest和requestWithURL加載遠程內(nèi)容青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/64項目一實現(xiàn)概述創(chuàng)建一個應用程序，顯示從網(wǎng)站FloraP獲取的花朵照片和花朵信息。讓用戶輕按分段控件中的一種花朵顏色，然后從網(wǎng)站上取回一朵這樣顏色的花朵，并在Web視圖中顯示它。使用開關來顯示和隱藏另一個Web視圖，該視圖包含

3、有關該花朵的詳細信息。通過按鈕讓用戶能夠從網(wǎng)站取回另一張當前選定顏色的花朵照片。青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/65青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/66 1、創(chuàng)建Single View Application項目,名稱為flowerView.2、設計界面 選擇MainStoryboard.storyboard在IB編輯器中打開它。 添加分段控件對象UISegmentedControl，設置其Segments屬性為4，分別設置其title屬性為Red、Blue、Yello和Green。 添加開關對象UISwitch，

4、將其默認狀態(tài)State屬性改為OFF青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/67 添加一個Web視圖UIWebView，命名為flowerView，用來顯示圖像，選中Scales Page to Fit屬性。 再添加一個Web視圖UIWebView，命名為flowerDetailView，將其放在flowerView的上面，設置其alpha的值為0.65 添加一個按鈕UIButton，讓用戶隨時手工觸發(fā)獲取圖像的方法getFlower青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/68 3、創(chuàng)建并連接輸出口和操作 用于指定顏色的分段控件：

5、colorChoice 用于顯示花朵本身的Web視圖：flowerView 顯示花朵詳細信息的Web視圖：flowerDetailView 在用戶單擊獲取圖像按鈕時獲取花朵操作：getFlower，將UISegmentedControl的Value changed事件連接到getFlower方法。 根據(jù)開關的設置顯示/隱藏花朵詳細信息：toggleFlowerDetail青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/69 4、實現(xiàn)應用程序邏輯顯示隱藏詳細信息Web視圖- (IBAction)toggleFlowerDetail:(id)sender self.flow

6、erDetailView.hidden=!sender isOn;加載并顯示花朵圖像和詳細信息從分段控件獲取選定的顏色生成一個會話ID的隨機數(shù)，讓FloraP網(wǎng)站能夠跟蹤我們的請求請求URL http:/ http:/ 計算機教研室 崔守良 QQ：427882012021/8/610 -(IBAction)getFlower:(id)sender NSString *color=self.colorChoice titleForSegmentAtIndex: self.colorChoice.selectedSegmentIndex;int sessionID=random()%50000;N

7、SString *imageURLString=NSString alloc initWithFormat:http:/ 計算機教研室 崔守良 QQ：427882012021/8/611 NSString *detailURLString=NSString alloc initWithFormat:http:/ ,sessionID; NSURL *imageURL=NSURL alloc initWithString:imageURLString;NSURL *detailURL=NSURL alloc initWithString:detailURLString; self.flowerV

8、iew loadRequest:NSURLRequest requestWithURL:imageURL;self.flowerDetailView loadRequest:NSURLRequest requestWithURL:detailURL;self.flowerDetailView.backgroundColor=UIColor clearColor; 青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/612 5、修復應用程序加載時的界面問題 應用程序啟動時，兩個Web視圖都是空的，且顯示了詳細信息視圖，雖然開關被設置為OFF。 可在應用程序啟動后立刻加載一幅圖

9、像，并將flowerDetailView.hidden設置為YES。如- (void)viewDidLoad self.flowerDetailView.hidden=YES;self getFlower:nil; super viewDidLoad;青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/613使用可滾動視圖 UIScrollView滾動視圖，可在添加控件和界面元素時不受設備屏幕邊界的限制。 將對象加入可滾動視圖有兩種方案：一個選擇加入的對象，使用箭頭鍵將對象移到視圖可視區(qū)域外面的大概位置；二是選擇加入的對象，使用Size Inspector手工設置其X和Y坐標。 為給可滾動視圖添加滾動功能，需要將屬性contentSize設置為一個CGSize值。如：青島濱海學院 計算機教研室 崔守良 QQ：427882012021/8/614 -(void)viewDidLoad -self.theScroller.contentSize=CGSizeMake(28