前面已經將了上下拉刷新
實現了上下拉刷新后我們的第一級界面就做好,接下來我們就需要實現 新聞詳細信息瀏覽了
我個人認為一般實現新聞詳細頁面的方法有兩種(主要是數據源的不同導致了方法的不同)
第一種是本身新聞就是一個鏈接地址,同時是已經處理好的適應手機瀏覽的網頁
對於這種類型的數據源,我們直接在頁面中放一個WebView控件,然后將URL傳遞過去就好了
另一種則是普通的包含標題、時間、內容、圖片等數據結構的新聞內容(我們要實現的也是這種新聞,因為實現了這種之后, 我們就可以實現任何自定義的詳細信息的頁面了。)
首先我們需要新建一個UIViewController 取名叫做SingleNewsInfoViewController吧
具體的創建步驟我就不做截圖描述了,到這個地步沒必要再講這些了
直接開始正題吧
首先我們先在XIB文件中添加一個UIScroolView 然后在UIScroolView中添加 兩個UILabel 控件和一個UITextView控件
結構如下圖所示
然后是配置.H文件
不多說。直接上代碼比較直觀
#import <UIKit/UIKit.h> @interface SingleNewsInfoViewController : UIViewController{ NSString *mynewid; UILabel *titlelabel; UILabel *timelabel; NSArray *images; UITextView *contenttextview; UIScrollView *mainscrollview; BOOL haveimage; } @property(nonatomic,retain) IBOutlet UILabel *titlelabel; @property(nonatomic,retain) IBOutlet UILabel *timelabel; @property(nonatomic,retain) IBOutlet UITextView *contenttextview; @property(nonatomic,retain)IBOutlet UIScrollView *mainscrollview; @property(nonatomic,retain) NSString *mynewid; @property(nonatomic,retain) NSArray *images; @property(nonatomic) BOOL haveimage; @end
然后在.m文件中聲明好各個屬性后 將對應的XIB文件中的控件與代碼中的變量 建立關聯
這邊需要解釋解釋一下幾個屬性的用處
mynewid的話是由上一級頁面 傳遞過來的新聞ID,我們可以通過該ID從后台獲取新聞的詳細參數
images的話是用來存儲后來獲取過來的圖片集合。
建立好管理后我們再接着修改.M文件
.m文件的話還需要添加兩個頭文件
#import "GetWebInfo.h"
#import "Base64AndImageHelp.h"
GetWebInfo的話相信大家都已經知道是什么用的了。如果不知道的話請看前幾張,
而Base64AndImageHelp類的話是我自定義的義個類,用來實現將base64的數據轉化為Image格式的數據用的(這個會在之后的章節進行介紹)
對於.M文件的話我們只需要修改他的viewDidLoad方法就可以了
具體代碼如下
代碼相對而言沒有什么特別難的地方
唯一有問題的可能就是Base64AndImageHelp部分,不過這部分 大家只要知道他是將后台傳遞過來的base64的string 圖片數據轉換成image數據就可以了
- (void)viewDidLoad { GetWebInfo *getwebinfo=[GetWebInfo alloc]; NSString *myparameters=[[NSString alloc] initWithString:[NSString stringWithFormat:@"Method=getSingleNewsbyId&new_id=%@",mynewid]]; getwebinfo.parameters=myparameters; NSString *webReturnMessage=[getwebinfo dogetWebInfo]; NSData* jsonData=[webReturnMessage dataUsingEncoding:NSUTF8StringEncoding]; NSArray *keys = [NSJSONSerialization JSONObjectWithData:jsonData options:NSJSONReadingMutableContainers error:nil]; // NSLog(@"%@",keys); timelabel.text=[[keys objectAtIndex:0]valueForKey:@"time"]; titlelabel.text=[[keys objectAtIndex:0 ]valueForKey:@"title"]; contenttextview.text=[[keys objectAtIndex:0 ]valueForKey:@"contents"]; NSInteger i=0; if(haveimage) { images=[[[keys objectAtIndex:0 ]valueForKey:@"images"] componentsSeparatedByString:@","]; for (NSString *singleimage in images) { NSData *newimage=[Base64AndImageHelp mydataWithBase64EncodedString:singleimage]; UIImage *newjiaban=[[UIImage alloc] initWithData:newimage]; UIImageView *imageView = [[UIImageView alloc] init]; [self.mainscrollview addSubview:imageView]; imageView.frame = CGRectMake(20 ,170*i+100,280,150);//left ,top ,width ,height imageView.image=newjiaban; i++; } } contenttextview.frame=CGRectMake(20 ,170*i+100,280,310); mainscrollview.contentSize=CGSizeMake(280, 390+170*i); [super viewDidLoad]; // Do any additional setup after loading the view from its nib. }
到了這一步我們已經基本完成了新聞詳細信息的瀏覽了。
最后我們還需要返回到NEWSViewController中 實現UITableView的行點擊事件didSelectRowAtIndexPath,
實現點擊了新聞標題后,跳轉到新聞詳細信息頁面的效果。
首先需要在NEWSViewController添加SingleNewsInfoViewController的引用。
然后實現didSelectRowAtIndexPath方法,具體代碼如下。
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { SingleNewsInfoViewController *singlenewsinfoViewController= [[SingleNewsInfoViewController alloc]initWithNibName:@"SingleNewsInfoViewController" bundle:nil]; NSString *myid=[[NSString alloc] initWithFormat:@"%@",[[[_list objectAtIndex:[indexPath section]] objectAtIndex:[indexPath row]] valueForKey:@"ID"]]; singlenewsinfoViewController.mynewid=myid; NSString *haveImage=[[NSString alloc] initWithString:[[[_list objectAtIndex:[indexPath section]] objectAtIndex:[indexPath row]] valueForKey:@"images"]]; if([haveImage isEqual:@"False"]) { singlenewsinfoViewController.haveimage=NO; } else { singlenewsinfoViewController.haveimage=YES; } singlenewsinfoViewController.title=@"新聞詳情"; singlenewsinfoViewController.hidesBottomBarWhenPushed=YES; [self.navigationController pushViewController:singlenewsinfoViewController animated:YES]; }
OK這樣就完成了我們的新聞詳細信息瀏覽的效果
不過這樣實現了以后還會有點小BUG ,我會在下一章中進行講解如何解決該BUG的。
最后再附上兩張圖片大家也可以自己動手試下,看看BUG在哪里。