Tableview UiDesign複雜性

Question

任何人都可以指導我實現這個UITableView的UI設計。我有一個表格視圖，每個單元格內有不同顏色的單元格和一些標籤。

當用戶滾動表格視圖時，彩色單元格上的標籤應該回到位於屏幕底部並用兩行代碼的底部欄，但底部欄背景顏色應該改變爲與選定的單元格顏色。

i think the attached image will give you clear idea how it should be 

Answer 1

我希望從我的代碼中得到的結果是您期待的結果。

結果如下所示。

如果結果是所預期的，請按照下列步驟記錄下來： -

第1步：設置了UIView。

我已經使用故事板的方法來設計這個程序。在頂部和底部添加一個UIView。在他們之間添加一個UITableView。

這將導致下面的UIView。由於我正在使用故事板方法，因此我可以將自定義單元格直接添加到UITableView。

注意：您需要設置要在代碼中重用的單元格的「標識符」。爲此，請轉到屬性檢查器，並將字符串設置爲「標識符」字段。可以說標識符是「CellID」，您將在代碼中使用它。

UIView設置完成後，請在bottomView上創建一個IBOutlet，並將UITableView的代理，數據源標記爲ViewController。

STEP 2編碼

我已經使用的UIColor對象的NSArray，一個陣列對選定的背景顏色和其他用於小區的正常背景顏色。

- (void)viewDidLoad 
{ 
    [super viewDidLoad]; 
    // Do any additional setup after loading the view, typically from a nib. 
    /* 
    Loading UIColor into NSArray. 
    */ 

    colors=[NSArray arrayWithObjects:[UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:0.2], 
     [UIColor colorWithRed:0.0 green:1.0 blue:0.0 alpha:0.2 ], 
      [UIColor colorWithRed:0.0 green:0.0 blue:1.0 alpha:0.2 ],[UIColor colorWithRed:1.0 green:1.0 blue:0.0 alpha:0.2], nil]; 

    selectionColors=[NSArray arrayWithObjects:[UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:1.0], 
      [UIColor colorWithRed:0.0 green:1.0 blue:0.0 alpha:1.0 ], 
      [UIColor colorWithRed:0.0 green:0.0 blue:1.0 alpha:1.0 ],[UIColor colorWithRed:1.0 green:1.0 blue:0.0 alpha:1.0], nil]; 
} 

表方法

-(NSInteger) numberOfSectionsInTableView:(UITableView *)tableView{ 
    return 12; 
} 

-(NSInteger) tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ 
    return 1; 
} 


-(void) tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{ 
    /* 
    Setting up the background colours for selected and normal state 
    */ 
    cell.backgroundColor=[colors objectAtIndex:(indexPath.section%4)]; 
    UIView *selectedBackgroudView=[[UIView alloc] init]; 
    [selectedBackgroudView setBackgroundColor:[selectionColors objectAtIndex:indexPath.section%4]]; 
    cell.selectedBackgroundView=selectedBackgroudView; 
} 

-(UITableViewCell*) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{ 
    /* 
    This cell Identifier must be the same which you have set in the storyboard file for a UITableViewCell 
    */ 
    static NSString *cellIdentififer=@"CellID"; 
    UITableViewCell *cell=[tableView dequeueReusableCellWithIdentifier:cellIdentififer]; 
    return cell; 
} 


-(CGFloat) tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{ 
    return 10.0; 
} 


-(UIView*) tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{ 
    /* 
     To have spacing for each section with height is 10.0 
    */ 
    UIView *footerV=[[UIView alloc] init]; 
    return footerV; 
} 

-(void) tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{ 
    /* 
     Setting up the shadow to the bottomView based on the selected cell, selected background colour. 
    */ 
    UITableViewCell *cell=[tableView cellForRowAtIndexPath:indexPath]; 
    UIColor *color=cell.selectedBackgroundView.backgroundColor;; 
    self.bottomView.backgroundColor=color; 
    self.bottomView.layer.shadowColor=color.CGColor; 
    self.bottomView.layer.shadowOpacity=0.9; 
    self.bottomView.layer.shadowPath=[UIBezierPath bezierPathWithRect:CGRectMake(-10.0, -10.0, self.view.frame.size.width+20, 20)].CGPath; 
}