UIToolbar에서 왼쪽 화살표 버튼 (예 : UINavigationBar의 "뒤로"스타일 만들기)
에 '뒤로'왼쪽 화살표 베젤 버튼을 만들고 싶습니다 UIToolbar
.
내가 알 수있는 한, 이들 중 하나를 얻는 유일한 방법 UINavigationController
은 기본 설정을 유지하고 왼쪽 막대 항목에 하나를 사용하는 것입니다. 그러나 하나를로 만들 수있는 방법 UIBarButtonItem
은 없으므로 표준 UIToolbar
과 비슷하지만 표준으로 만들 수는 없습니다 UINavigationBar
.
버튼 이미지로 수동으로 만들 수 있지만 소스 이미지를 어디에서나 찾을 수 없습니다. 알파 채널 가장자리가 있으므로 스크린 샷 및 잘라내 기는 매우 다양한 결과를 얻지 못합니다.
사용하려는 모든 크기 및 색상 구성표에 대해 스크린 샷을 넘어서는 아이디어가 있습니까?
업데이트 : 질문을 피하고이 질문을하지 말고 사용하도록 제안하십시오 UINavigationBar
. 내 앱은 Instapaper Pro입니다. 공간을 절약하고 읽을 수있는 내용 영역을 최대화하기 위해 아래쪽 도구 모음 만 표시하고 왼쪽 화살표 모양의 뒤로 버튼을 아래쪽에 배치하고 싶습니다.
내가 이것을 할 필요 가 없다고 말하면 대답 이 아니며 분명히 현상금을받을 자격이 없습니다.
http://www.teehanlax.com/blog/?p=447 에서 파생 된 다음 psd를 사용했습니다 .
http://www.chrisandtennille.com/pictures/backbutton.psd
그런 다음 툴바 항목의 customView 속성에서 사용하는 사용자 정의 UIView를 만들었습니다.
나를 위해 잘 작동합니다.
편집 : 바와 같이 지적 PrairieHippo는 , maralbjo는 다음을 사용하여, 간단한 코드는이 대답과 함께해야 트릭을 (번들 정의 이미지를 필요) 한 것으로 나타났다. 추가 코드는 다음과 같습니다.
// Creates a back button instead of default behaviour (displaying title of previous screen)
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"back_arrow.png"]
style:UIBarButtonItemStyleBordered
target:self
action:@selector(backAction)];
tipsDetailViewController.navigationItem.leftBarButtonItem = backButton;
[backButton release];
유니 코드 방법
유니 코드 문자를 사용하여 작업을 완료하는 것이 훨씬 쉽다고 생각합니다. 유니 코드 삼각형 또는 유니 코드 화살표를 검색하여 화살표를 살펴볼 수 있습니다 . iOS6부터 Apple은 문자를 테두리가있는 이모티콘 문자로 변경했습니다. 테두리를 비활성화하려면 0xFE0E 유니 코드 변형 선택기를 추가합니다 .
NSString *backArrowString = @"\U000025C0\U0000FE0E"; //BLACK LEFT-POINTING TRIANGLE PLUS VARIATION SELECTOR
UIBarButtonItem *backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:backArrowString style:UIBarButtonItemStylePlain target:nil action:nil];
self.navigationItem.leftButtonItem = backBarButtonItem;
코드 블록은 데모 용입니다. NSString을 허용하는 모든 버튼에서 작동합니다.
전체 문자 목록을 보려면 Google에서 유니 코드 문자 및 원하는 항목을 검색하십시오. 다음은 Black Left-Pointing Triangle 항목입니다 .
결과
경고 : iOS 6에서는 작동하지 않는다는보고가 있습니다. 이는 이전 버전의 OS에서만 작동 할 수 있습니다. 분명히 적어도 하나의 개발자 가이 트릭을 사용하여 앱을 거부했습니다 (댓글 참조). 자신의 책임하에 사용하십시오. 이미지를 사용하면 (위의 답변 참조) 더 안전한 솔루션 일 수 있습니다.
올바른 모양을 얻기 위해 sekr1t 버튼 유형 101을 사용하여 이미지 파일을 추가하지 않고도이 작업을 수행 할 수 있습니다. 나를 위해 속임수는 initWithCustomView
을 만드는 데 사용할 수 있다는 것을 알았 습니다 BarButtonItem
. 개인적으로 a 대신 동적 탐색 표시 줄에 필요 toolbar
했지만 툴바로 테스트했지만 코드는 거의 동일합니다.
// create button
UIButton* backButton = [UIButton buttonWithType:101]; // left-pointing shape!
[backButton addTarget:self action:@selector(backAction) forControlEvents:UIControlEventTouchUpInside];
[backButton setTitle:@"Back" forState:UIControlStateNormal];
// create button item -- possible because UIButton subclasses UIView!
UIBarButtonItem* backItem = [[UIBarButtonItem alloc] initWithCustomView:backButton];
// add to toolbar, or to a navbar (you should only have one of these!)
[toolbar setItems:[NSArray arrayWithObject:backItem]];
navItem.leftBarButtonItem = backItem;
툴바 에서이 작업을 수행하는 경우 항목 설정 방법을 조정해야하지만 나머지 코드에 따라 다르며 독자의 연습으로 남겨 둡니다. : P이 샘플은 저에게 효과적이었습니다 (컴파일 및 실행).
Blah blah, HIG를 읽고, 문서화되지 않은 기능을 사용하지 마십시오. 지원되는 버튼 유형은 6 가지 뿐이며 그중 하나도 아닙니다.
우선 뒤로 버튼의 이미지를 찾아야합니다. iPhone에서 모든 그래픽을 추출하는 Extractor 라는 멋진 앱을 사용했습니다 . iOS7 에서는 호출 된 이미지를 검색 할 UINavigationBarBackIndicatorDefault
수 있었고 검은 색조였습니다. 빨간 색조가 필요했기 때문에
Gimp를 사용하여 색상을 빨간색으로 변경했습니다.
편집하다:
그의 의견에서 btate 가 언급했듯이 이미지 편집기로 색상을 변경할 필요가 없습니다. 다음 코드는 트릭을 수행해야합니다.
imageView.tint = [UIColor redColor];
imageView.image = [[UIImage imageNamed:@"UINavigationBarBackIndicatorDefault"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
그런 다음 해당 화살표가있는 imageView가 포함 된보기, 사용자 정의 텍스트가있는 레이블 및보기 위에 동작이있는 버튼이 있습니다. 그런 다음 간단한 애니메이션 (페이딩 및 번역)을 추가했습니다.
다음 코드는 애니메이션을 포함하여 뒤로 버튼의 동작을 시뮬레이션합니다.
-(void)viewWillAppear:(BOOL)animated{
UIImageView *imageView=[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"UINavigationBarBackIndicatorDefault"]];
[imageView setTintColor:[UIColor redColor]];
UILabel *label=[[UILabel alloc] init];
[label setTextColor:[UIColor redColor]];
[label setText:@"Blog"];
[label sizeToFit];
int space=6;
label.frame=CGRectMake(imageView.frame.origin.x+imageView.frame.size.width+space, label.frame.origin.y, label.frame.size.width, label.frame.size.height);
UIView *view=[[UIView alloc] initWithFrame:CGRectMake(0, 0, label.frame.size.width+imageView.frame.size.width+space, imageView.frame.size.height)];
view.bounds=CGRectMake(view.bounds.origin.x+8, view.bounds.origin.y-1, view.bounds.size.width, view.bounds.size.height);
[view addSubview:imageView];
[view addSubview:label];
UIButton *button=[[UIButton alloc] initWithFrame:view.frame];
[button addTarget:self action:@selector(handleBack:) forControlEvents:UIControlEventTouchUpInside];
[view addSubview:button];
[UIView animateWithDuration:0.33 delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
label.alpha = 0.0;
CGRect orig=label.frame;
label.frame=CGRectMake(label.frame.origin.x+25, label.frame.origin.y, label.frame.size.width, label.frame.size.height);
label.alpha = 1.0;
label.frame=orig;
} completion:nil];
UIBarButtonItem *backButton =[[UIBarButtonItem alloc] initWithCustomView:view];
}
- (void) handleBack:(id)sender{
}
편집하다:
버튼을 추가하는 대신 제스처 인식기를 사용하는 것이 더 나은 방법이라고 생각합니다.
UITapGestureRecognizer* tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleBack:)];
[view addGestureRecognizer:tap];
[view setUserInteractionEnabled:YES];
이것이 작동하는지 확실하지 않지만 UINavigationController
기본 설정을 사용하여 버튼을 만들고 탐색 컨트롤러의 하위보기 계층에서 버튼을 찾아서 호출 removeFromSuperview
하고 탐색 컨트롤러를 파괴 한 다음 버튼을 다음과 같이 추가 할 수 있습니다 툴바의 하위보기. 프로세스 중에 할당 해제되는 것을 피하기 위해 retain
호출하기 전에 removeFromSuperview
(및 release
툴바의 하위보기로 추가 한 후) 버튼과 버튼이 필요할 수도 있습니다 .
화살표가있는 UIButton을 iOS 7 시스템의 뒤로 화살표에 가깝게 만들려면 (나는 디자이너가 아닙니다.)
표준:
애플 SD 고딕 네오
Xcode에서 :
- 버튼의 제목 값 필드 (또는 텍스트 내용이있는 다른보기 / 컨트롤)에 중점을 둡니다.
- 편집-> 특수 문자를 엽니 다
- 괄호 그룹을 선택하고 '<'문자를 두 번 클릭하십시오.
- 글꼴을 다음과 같이 변경하십시오. Apple SD Gothic Neo, 원하는 크기의 일반 (예 : 20)
- 당신이 원하는대로 색상을 변경
iOS 7에서 Back-like arrow에 대한 @staticVoidMan의 답변 참조
이미지 파일을 신경 쓰지 않으려면 다음 코드를 사용하여 화살표 모양을 UIView 하위 클래스에 그릴 수 있습니다.
- (void)drawRect:(CGRect)rect {
float width = rect.size.width;
float height = rect.size.height;
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextBeginPath(context);
CGContextMoveToPoint(context, width * 5.0/6.0, height * 0.0/10.0);
CGContextAddLineToPoint(context, width * 0.0/6.0, height * 5.0/10.0);
CGContextAddLineToPoint(context, width * 5.0/6.0, height * 10.0/10.0);
CGContextAddLineToPoint(context, width * 6.0/6.0, height * 9.0/10.0);
CGContextAddLineToPoint(context, width * 2.0/6.0, height * 5.0/10.0);
CGContextAddLineToPoint(context, width * 6.0/6.0, height * 1.0/10.0);
CGContextClosePath(context);
CGContextSetFillColorWithColor(context, [UIColor blackColor].CGColor);
CGContextFillPath(context);
}
여기서 화살표보기는 너비 6.0과 높이 10.0에 비례합니다.
self.navigationItem.leftBarButtonItem = self.navigationItem.backBarButtonItem;
나를 위해 작동합니다. 더 많은 탭이 있고 탭 막대에 맞을 수있을 때 이것을 사용했으며 "더보기"에서 푸시 된 뷰 컨트롤러가 viewDidLoad의 leftBarButtonItem을 덮어 씁니다.
UIKit $ {SDKROOT} /System/Library/Frameworks/UIKit.framework/Other.artwork의 Other.artwork에서 소스 이미지를 추출하여 소스 이미지를 찾을 수 있습니다. 모딩 커뮤니티에는이를 추출하기위한 몇 가지 도구가 있습니다 . 이미지를 추출하면 코드를 작성하여 필요에 따라 다시 채색하고 버튼 이미지로 설정할 수 있습니다. 실제로 파생물을 포함하고 있기 때문에 그러한 물건을 배송 할 수 있는지 여부는 약간 까다로울 수 있으므로 변호사와 상담하고 싶을 수도 있습니다.
Three20 라이브러리에는 다음과 같은 방법이 있습니다.
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle: @"Title" style:UIBarButtonItemStylePlain
target:self action:@selector(foo)];
UIColor* darkBlue = RGBCOLOR(109, 132, 162);
TTShapeStyle* style = [TTShapeStyle styleWithShape:[TTRoundedLeftArrowShape shapeWithRadius:4.5] next:
[TTShadowStyle styleWithColor:RGBCOLOR(255,255,255) blur:1 offset:CGSizeMake(0, 1) next:
[TTReflectiveFillStyle styleWithColor:darkBlue next:
[TTBevelBorderStyle styleWithHighlight:[darkBlue shadow]
shadow:[darkBlue multiplyHue:1 saturation:0.5 value:0.5]
width:1 lightSource:270 next:
[TTInsetStyle styleWithInset:UIEdgeInsetsMake(0, -1, 0, -1) next:
[TTBevelBorderStyle styleWithHighlight:nil shadow:RGBACOLOR(0,0,0,0.15)
width:1 lightSource:270 next:nil]]]]]];
TTView* view = [[[TTView alloc] initWithFrame:CGRectMake(0, 0, 80, 35)] autorelease];
view.backgroundColor = [UIColor clearColor];
view.style = style;
backButton.customView = view;
self.navigationItem.leftBarButtonItem = backButton;
다음과 같은 간단한 코드를 사용하여 트릭을 수행한다는 것을 알았습니다 (번들에 사용자 정의 이미지가 필요함).
// Creates a back button instead of default behaviour (displaying title of previous screen)
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"back_arrow.png"]
style:UIBarButtonItemStyleBordered
target:self
action:@selector(backAction)];
tipsDetailViewController.navigationItem.leftBarButtonItem = backButton;
[backButton release];
다음은이 모든 솔루션과 다른 솔루션을 검색 한 결과입니다. UIKit 스톡 이미지에서 추출한 신축성이있는 PNG를 사용합니다. 이렇게하면 원하는대로 텍스트를 설정할 수 있습니다
// Generate the background images
UIImage *stretchableBackButton = [[UIImage imageNamed:@"UINavigationBarDefaultBack.png"] stretchableImageWithLeftCapWidth:14 topCapHeight:0];
UIImage *stretchableBackButtonPressed = [[UIImage imageNamed:@"UINavigationBarDefaultBackPressed.png"] stretchableImageWithLeftCapWidth:13 topCapHeight:0];
// Setup the UIButton
UIButton *backButton = [UIButton buttonWithType:UIButtonTypeCustom];
[backButton setBackgroundImage:stretchableBackButton forState:UIControlStateNormal];
[backButton setBackgroundImage:stretchableBackButtonPressed forState:UIControlStateSelected];
NSString *buttonTitle = NSLocalizedString(@"Back", @"Back");
[backButton setTitle:buttonTitle forState:UIControlStateNormal];
[backButton setTitle:buttonTitle forState:UIControlStateSelected];
backButton.titleEdgeInsets = UIEdgeInsetsMake(0, 5, 2, 1); // Tweak the text position
NSInteger width = ([backButton.titleLabel.text sizeWithFont:backButton.titleLabel.font].width + backButton.titleEdgeInsets.right +backButton.titleEdgeInsets.left);
[backButton setFrame:CGRectMake(0, 0, width, 29)];
backButton.titleLabel.font = [UIFont boldSystemFontOfSize:13.0f];
[backButton addTarget:self action:@selector(yourSelector:) forControlEvents:UIControlEventTouchDown];
// Now add the button as a custom UIBarButtonItem
UIBarButtonItem *backButtonItem = [[[UIBarButtonItem alloc] initWithCustomView:backButton] autorelease];
self.navigationItem.leftBarButtonItem = backButtonItem;
Xcode 5.x의 Interface Builder 로 쉽게 할 수 있습니다.
객체 라이브러리 에서 도구 모음 및 막대 버튼 항목 사용
버튼의에서 속성 관리자의 편집 이미지 와 섹션 하여 다시 버튼 이미지
끝난!
나는 같은 일을하려고했지만 탐색 버튼에 뒤로 버튼이 있기를 원했습니다. (실제로 돌아가는 것 이상을 수행하는 뒤로 버튼이 필요했기 때문에 leftBarButtonItem 속성을 사용해야했습니다.) AndrewS가 제안한 것을 시도했지만 UIButton은 UIBarButtonItem으로 캐스팅되었으므로 탐색 모음에서는 정상적으로 보이지 않습니다.
그러나이 문제를 해결할 수있는 방법을 찾았습니다. 실제로 UIButton 아래에 UIView를 넣고 UIBarButtonItem에 대한 customView를 설정했습니다. 누군가가 필요로하는 경우 코드는 다음과 같습니다.
// initialize button and button view
UIButton *backButton = [UIButton buttonWithType:101];
UIView *backButtonView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, backButton.frame.size.width, backButton.frame.size.height)];
[backButton addTarget:self action:@selector(backButtonTouched:) forControlEvents:UIControlEventTouchUpInside];
[backButton setTitle:@"Back" forState:UIControlStateNormal];
[backButtonView addSubview:backButton];
// set buttonview as custom view for bar button item
UIBarButtonItem *backButtonItem = [[UIBarButtonItem alloc] initWithCustomView:backButtonView];
self.navigationItem.leftBarButtonItem = backButtonItem;
// push item to navigationbar items
[self.navigationController.navigationBar setItems:[NSArray arrayWithObject:backButtonItem]];
UIToolbar에 대한 이미지를 만들려면 Photoshop에서 png를 만들고 흰색을 넣는 색상이 있으면 알파 = 0이면 그대로 둡니다.
SDK는 실제로 사용자가 만든 아이콘 주위에 테두리를두고 아무 작업도하지 않고 흰색으로 바꿉니다.
참조, 이것은 내 앞으로 버튼을 위해 Photoshop에서 만든 것입니다 (분명히 뒤로 버튼으로 바꾸십시오).
이것이 Interface Builder에서 보이는 모습입니다.
png를 사용하지 않고 솔루션. 이 SO 답변을 바탕으로 : iPhone TableView 셀에서 셀의 오른쪽에 작은 화살표 추가
UITableViewCell을 가로로 뒤집기 만하면됩니다!
UIButton *btnBack = [[UIButton alloc] initWithFrame:CGRectMake(0, 5, 70, 20)];
// Add the disclosure
CGRect frm;
UITableViewCell *disclosure = [[UITableViewCell alloc] init];
disclosure.transform = CGAffineTransformScale(CGAffineTransformIdentity, -1, 1);
frm = self.btnBack.bounds;
disclosure.frame = CGRectMake(frm.origin.x, frm.origin.y, frm.size.width-25, frm.size.height);
disclosure.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
disclosure.userInteractionEnabled = NO;
[self.btnBack addSubview:disclosure];
// Add the label
UILabel *lbl = [[UILabel alloc] init];
frm = CGRectOffset(self.btnBack.bounds, 15, 0);
lbl.frame = frm;
lbl.textAlignment = NSTextAlignmentCenter;
lbl.text = @"BACK";
[self addSubview:lbl];
직접 그리기를 피하려면 문서화되지 않은 클래스 인 UINavigationButton을 스타일 1로 사용할 수 있습니다. 물론 응용 프로그램의 승인이 중지 될 수 있습니다. / John
글쎄, 당신은 모든 크기에 대해 다른 버튼을 가질 필요는 없습니다, 당신은 사용할 수 있습니다 [UIImage stretchableImageWithLeftCapWidth:topCapHeight:]
.
비슷한 문제가 있었고 하나의 라이브러리 PButton이 나왔습니다 . 그리고 샘플은 버튼과 같은 뒤로 탐색 버튼으로, 사용자 정의 버튼처럼 어디서나 사용할 수 있습니다.
이 같은:
오른쪽 상단에 이전 및 다음 버튼이있는 Swift 3의 예입니다.
let prevButtonItem = UIBarButtonItem(title: "\u{25C0}", style: .plain, target: self, action: #selector(prevButtonTapped))
let nextButtonItem = UIBarButtonItem(title: "\u{25B6}", style: .plain, target: self, action: #selector(nextButtonTapped))
self.navigationItem.rightBarButtonItems = [nextButtonItem, prevButtonItem]
빠른
// create button
var backButton = UIButton(type: 101)
// left-pointing shape!
backButton.addTarget(self, action: #selector(self.backAction), for: .touchUpInside)
backButton.setTitle("Back", for: .normal)
// create button item -- possible because UIButton subclasses UIView!
var backItem = UIBarButtonItem(customView: backButton)
// add to toolbar, or to a navbar (you should only have one of these!)
toolbar.items = [backItem]
navItem.leftBarButtonItem = backItem
이 시도. 그런 이미지를 만들기 위해 뒤로 버튼 이미지가 필요하지 않습니다.
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:@"Back"
style:UIBarButtonItemStyleBordered
target:self
action:@selector(yourSelectorGoesHere:)];
self.navigationItem.backBarButtonItem = backButton;
그게 당신이해야 할 전부입니다 :)
왜 이런 짓을하는? 탐색 막대처럼 보이는 것을 원하면 UINavigationBar를 사용하십시오.
툴바에는 특정한 시각적 스타일이 있습니다. iPhone 상태에 대한 휴먼 인터페이스 지침 :
도구 모음이 화면의 아래쪽 가장자리에 나타나고 현재보기에서 객체와 관련된 작업을 수행하는 버튼이 있습니다.
그런 다음 텍스트가없는 대략 정사각형 아이콘의 몇 가지 시각적 예를 제공합니다. 나는 이것에 대해 HIG를 따르기를 촉구합니다.
'Programing' 카테고리의 다른 글
Swift를 사용하여 귀중한 문자열을 어떻게 만듭니 까? (0) | 2020.03.19 |
---|---|
Vimdiff에서 diff 섹션을 확장 / 축소하는 방법은 무엇입니까? (0) | 2020.03.19 |
C ++와 C 결합-#ifdef __cplusplus는 어떻게 작동합니까? (0) | 2020.03.19 |
반환 값과 Promise.resolve의 차이점은 then ()에서 (0) | 2020.03.19 |
Windows의 Node.js에서 hello.js 파일을 실행하는 방법은 무엇입니까? (0) | 2020.03.19 |