iOS索引列开发详解

作苹果开发的朋友在地区列表可能会遇到在页面的右侧有一列相似与导航的索引列,此次有机会遇到了,细细研究了一下,原来没有想象中的困难,只须要简单的几步就能作出本身的索引列。原本想和搜索条在一块讲解,后来考虑了一下,这个东西和搜索条功能虽有类似之处,却并不是须要一块儿使用,因此就单独摘出来,独立介绍吧!c++

索引列看着就很高大上,实际作出来的效果也挺不错的。这个既不须要引入第三方的类库,还不须要单独的委托,它是uitableview列表控件的一个功能的延伸,将用户的体验作到极致,这也就是苹果细致、人性化的地方。下面开始关于索引列的讲解。ui

第一步:添加列表委托UITableViewDataSource, UITableViewDelegatespa

第二步:列表控件的添加code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
self.myTableView = 
[[[UITableView alloc] initWithFrame:CGRectMake(0, 0, 320, 
UI_View_Hieght+64) style:UITableViewStylePlain]autorelease];
     [myTableView setBackgroundColor:BB_Back_Color_Here_Bar];
     [myTableView setBackgroundView:nil];
     myTableView.separatorStyle = UITableViewCellSeparatorStyleSingleLine;
     myTableView.dataSource = self;
     myTableView.delegate = self;
     myTableView.allowsSelection=YES;
     //[myTableView setScrollEnabled:NO];
     myTableView.showsHorizontalScrollIndicator = NO;
     myTableView.showsVerticalScrollIndicator = NO;
     //[XtomFunction addbordertoView:myTableView radius:8.0f width:0.0f color:BB_White_Color];
     //设置索引列文本的颜色
     myTableView.sectionIndexColor = BB_Yanzheng_Color;
     //myTableView.sectionIndexBackgroundColor=BB_Red_Color;
     //myTableView.sectionIndexTrackingBackgroundColor=BB_White_Color;
     
     [self.view addSubview:myTableView];

这里有个须要注意的地方,也是我花费了一段时间才总结出来的经验,右侧索引列的文本颜色是能够自定义改变的 myTableView.sectionIndexColor = BB_Yanzheng_Color。只须要设置这个属性便可,当初花费了我很多精力,差点自定义去设置,偶然间发现原来苹果已经自定义好了这个属性,因此之后仍是得从源头上解决问题。orm

第三步:索引列数据的获取blog

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
for (char c = 'A' ;c<= 'Z' ;c++)
  
     {
  
         //当前字母
  
         NSString *zimu=[NSString stringWithFormat:@ "%c" ,c];
  
         if  (![zimu 
isEqualToString:@ "I" ]&&![zimu 
isEqualToString:@ "O" ]&&![zimu 
isEqualToString:@ "U" ]&&![zimu isEqualToString:@ "V" ])
  
         {
  
             [suoyinCityList addObject:[NSString stringWithFormat:@ "%c" ,c]];
  
         }
  
  }

第四步:相关委托的使用索引

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
//添加索引列
  
-(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView
  
{
  
     
  
     if  (tableView == self.searchDisplayController.searchResultsTableView)
  
     {
  
         return  nil;
  
     }
  
  
  
     return  suoyinCityList;
  
}
  
//索引列点击事件
  
-(NSInteger)tableView:(UITableView *)tableView sectionForSectionIndexTitle:(NSString *)title atIndex:(NSInteger)index
  
{
  
  NSLog(@ "===%@  ===%d" ,title,index);
  
  //点击索引,列表跳转到对应索引的行
  
  [tableView 
scrollToRowAtIndexPath:[NSIndexPath indexPathForRow:0 inSection:index+4]
  atScrollPosition:UITableViewScrollPositionTop animated:YES];
  
     
  
  //弹出首字母提示
  
  //[self showLetter:title ];
  
  return  index+4;
  
}

这里注释的已经很详细,基本不须要我多解释,惟一须要注意的地方是若是本页面里面有多个列表的话须要在不须要的列表中隐藏索引列,不然可能会出现奇怪的问题,主要是获取不到数据,由于索引列是和uitableview的配合使用的,这个注意一下就好。事件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
     if  (tableView == self.searchDisplayController.searchResultsTableView)
     {
         return  nil;
     }
     UIView *headView = [[[UIView alloc]init]autorelease];
     headView.backgroundColor = [UIColor clearColor];
     if  (section!=0)
     {
         //标题背景
         UIView *biaotiView = [[[UIView alloc]init]autorelease];
         biaotiView.backgroundColor = BB_White_Color;
         biaotiView.frame=CGRectMake(0, 0, 320, 30);
         [headView addSubview:biaotiView];
         
         //标题文字
         UILabel *lblBiaoti = [[[UILabel alloc]init]autorelease];
         lblBiaoti.backgroundColor = [UIColor clearColor];
         lblBiaoti.textAlignment = NSTextAlignmentLeft;
         lblBiaoti.font = [UIFont systemFontOfSize:15];
         lblBiaoti.textColor = [UIColor blackColor];
         lblBiaoti.frame = CGRectMake(15, 7.5, 200, 15);
         lblBiaoti.text = [headerList objectAtIndex:section-1];
         [biaotiView addSubview:lblBiaoti];
     }
     return  headView;
}
相关文章
相关标签/搜索