IOS 사용자 정의 UIPickView 상세 설명 및 인 스 턴 스 코드

IOS 사용자 정의 UIPickView
애플 은 네 이 티 브 구성 요 소 를 사용 하 는 것 을 선 호 해 왔 다.자체 적 으로 가 져 온 UIPickView 도 사실 예 쁘 고 아름 다 워 보 였 다.그러나 가끔 은 제품 에 특별한 디자인 과 수요 가 있다.본 고 는 애플 의 네 이 티 브 구성 요소 의 속성 을 어떻게 수정 하여 사용자 정의 UIPickView 효 과 를 얻 는 지 설명 할 것 이다.
수 요 는 다음 과 같다.Tab 를 사용자 정의 해 야 합 니 다.선택 한 텍스트 의 색상 을 사용자 정의 합 니 다.선택 한 색상 배경 을 사용자 정의 하고 선택 하지 않 은 텍스트 색상 을 사용자 정의 합 니 다.

선택 하지 않 은 텍스트 의 글꼴 과 색상 을 수정 합 니 다.
분석 을 통 해 위의 취소 와 확인 버튼 이 실현 되 는 것 은 매우 간단 하 다.하 나 를 추가 하면 됩 니 다.저 는 구체 적 인 절 차 를 소개 하지 않 겠 습 니 다.아래 에 선택 되 지 않 은 텍스트 의 색상 은 이미 글꼴 크기 입 니 다.우 리 는 아래 의 대리 방법 에서 수정 할 수 있 습 니 다.

//Change style
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{


  CGFloat width = [self pickerView:self.pickerView widthForComponent:component];
  CGFloat rowheight =[self pickerView:self.pickerView rowHeightForComponent:(component)];

  UIView *myView = [[UIView alloc]init];
  myView.frame =CGRectMake(0.0f, 0.0f, width, rowheight);
  UILabel *txtlabel = [[UILabel alloc] init];
  txtlabel.textColor = self.plainColor;
  txtlabel.tag=200;
  txtlabel.font = [UIFont systemFontOfSize:15*SCALE_6];
  txtlabel.textAlignment = NSTextAlignmentCenter;
  txtlabel.frame = myView.frame;
  txtlabel.text = [self pickerView:pickerView titleForRow:row forComponent:component];

  [myView addSubview:txtlabel];  
  return myView;
}

이렇게 하면 선택 하지 않 은 텍스트 의 색 을 수정 할 수 있 습 니 다.
선택 한 배경 색 과 글꼴 수정
하지만 배경 색 과 글씨 체 는 어떻게 수정 합 니까?바로 아래 그림 의 이 색상 과 자체 입 니 다.

나 는 처음에 이런 방법 을 시도 해 보 았 는데,바로 위 에 레이 블 을 한 층 더 넣 는 것 이다.그리고 대리 방법 에서 Label 의 값 을 바 꿉 니 다.

-(NSString*)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component
{
  if (component==0) {
    return self.leftArray[row];

  }else if(component==1){
    return self.rightArray[row];
  }else {
  return self.rightArray[row];
  }
}

그러나 이 방법 은 손가락 으로 클릭 하면 색인 값 이 맞지 않 는 다.이런 결 과 는 레이 블 이 한 번 씩 끊 긴 다 는 것 이다.이 방법 으로 만 Label 의 값 을 설정 하면 빠르게 미 끄 러 질 때 값 을 얻 지 못 하면 Label 값 변화 가 느 려 집 니 다.원생 의 그런 효과 가 전혀 없어졌다.
마지막 으로 저 는 시스템 그래 픽 을 가 져 오 는 방법 을 사 용 했 습 니 다.선택 기의 대리 방법 에서 해당 하 는 그래 픽 을 가 져 온 다음 에 수정 하 는 것 입 니 다.먼저 PickView 의 그림 층 을 살 펴 보 겠 습 니 다.

저 희 는 프 록 시 에서 해당 하 는 보 기 를 받 아서 수정 하면 됩 니 다.

 //Change style
- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{


  CGFloat width = [self pickerView:self.pickerView widthForComponent:component];
  CGFloat rowheight =[self pickerView:self.pickerView rowHeightForComponent:(component)];

  UIView *myView = [[UIView alloc]init];
  myView.frame =CGRectMake(0.0f, 0.0f, width, rowheight);
  UILabel *txtlabel = [[UILabel alloc] init];
  txtlabel.textColor = self.plainColor;
  txtlabel.tag=200;
  txtlabel.font = [UIFont systemFontOfSize:15*SCALE_6];
  txtlabel.textAlignment = NSTextAlignmentCenter;
  txtlabel.frame = myView.frame;
  txtlabel.text = [self pickerView:pickerView titleForRow:row forComponent:component];

  [myView addSubview:txtlabel];

  UIView* topLine  =  [pickerView.subviews objectAtIndex:1];
  UIView* botomLine  =  [pickerView.subviews objectAtIndex:2];
  topLine.hidden = YES;
  botomLine.hidden = YES;

  BOOL isSetttingBackColor = NO;

  UIView *subview = [self.pickerView.subviews firstObject];

  for ( UIView *pickerColumnView in subview.subviews) {

    NSLog(@"pickerColumnView class %@",[pickerColumnView class]);

    UIView *pickerView = [pickerColumnView.subviews lastObject];
    if (!isSetttingBackColor) {
       pickerView.backgroundColor = self.selectedBackColor;
      isSetttingBackColor = !isSetttingBackColor;
    }

    UIView *tableView = [pickerView.subviews lastObject];
    for (UIView *cell in tableView.subviews) {
      NSLog(@"cell class %@",[cell class]);
      UIView *cellview = [cell.subviews lastObject];
      UIView *labelSuper = [cellview.subviews lastObject];
      UILabel *label = [labelSuper.subviews lastObject];
      label.textColor = [UIColor whiteColor];
    }

  }
  return myView;
}

아래 코드 는 사용자 가 pickView 가 가지 고 있 는 두 개의 가 는 선 을 숨 기 는 것 입 니 다.

 UIView* topLine  =  [pickerView.subviews objectAtIndex:1];
  UIView* botomLine  =  [pickerView.subviews objectAtIndex:2];
  topLine.hidden = YES;
  botomLine.hidden = YES;

색상 변경 여 부 를 설정 합 니 다BOOL isSetttingBackColor = NO;이 변 수 는 배경 색 을 여러 번 설정 하 는 것 을 방지 하기 위해 서 입 니 다.서로 가 려 지게 하 다.
마지막 효 과 는 다음 과 같다.

데모 주소:http://xiazai.jb51.net/201612/yuanma/JSDCustomPickView-master(jb51.net).rar
읽 어 주 셔 서 감사합니다. 여러분 에 게 도움 이 되 기 를 바 랍 니 다.본 사이트 에 대한 여러분 의 지지 에 감 사 드 립 니 다!