2013-04-23 19 views
5

enter image description here Czy ktoś może mnie prowadzić w implementacji tego projektu interfejsu użytkownika dla UITableView. Mam widok tabeli z różnymi kolorowymi komórkami z niektórymi etykietami w każdej komórce.Tableview UiDesign złożoność

Gdy użytkownik przewija widok tabeli, etykieta na kolorowej komórce powinna powrócić do dolnego paska, który jest umieszczony u dołu ekranu za pomocą dwóch linii, ale kolor tła paska dolnego powinien zmienić się tak, wybrany kolor komórki.

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

jeden obraz tysiąc słów ... – Peres

+3

i co dokładnie jest pytanie? – thecoshman

+0

proszę wkleić kod napotkasz problemy z – user968597

Odpowiedz

2

Mam nadzieję, że wynik, który otrzymam z mojego kodu, jest tym, którego się spodziewasz.

Wynik wygląda tak, jak pokazano poniżej.

enter image description here

Jeśli wynik jest oczekiwany jeden, należy wykonać następujące kroki notuje: -

Krok 1: Konfigurowanie UIView.

Użyłem podejścia storyboardowego do zaprojektowania tej aplikacji. Dodaj UIView na górze i na dole. Między nimi dodaj UITableView.

Spowoduje to następujące UIView. Ponieważ używam podejścia storyboard, mogę dodać moją niestandardową komórkę bezpośrednio do UITableView.

Uwaga: Konieczne będzie ustawienie "Identyfikatora" dla komórki, która ma zostać ponownie wykorzystana w kodzie. W tym celu przejdź do atrybutu Inspektor i ustaw ciąg w polu "Identyfikator". powiedzmy, że identyfikator to "CellID", którego użyjesz w kodzie.

Po ustawieniu UIView należy wykonać IBOutlet na bottomView i oznaczyć delegata, źródło danych UITableView do ViewController.

enter image description here

Etap 2 kodowania

I stosuje NSArray obiektów UIColor jedna tablica do wybranego koloru tła i inne do normalnego koloru tła komórki.

- (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]; 
} 

Metody Tabela

-(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 *[email protected]"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; 
}