Erstellen eine Pfeiltaste nach links (wie UINavigationBar der „Zurück“ style) auf einem UIToolbar
https://stackoverflow.com/questions/227078
-
03-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianFrage
Ich würde gerne eine „zurück“ links-Pfeil-Rahmentaste in einem UIToolbar erstellen.
Soweit ich sagen kann, ist die einzige Möglichkeit, eine von ihnen zu bekommen, ist UINavigationController bei Standardeinstellung zu verlassen, und es verwendet eine für das linke Leistenelement. Aber es gibt keine Möglichkeit, die ich finden kann man als UIBarButtonItem zu schaffen, so kann ich nicht ein in einem Standard-UIToolbar machen, auch wenn sie zu UINavigationBars sehr ähnlich ist.
kann ich es manuell mit Tastenbildern erstellen, aber ich kann die Quellbilder nicht überall finden. Sie haben Alpha-Kanal Kanten, so screenshot und Schneiden nicht bekommen sehr vielseitig Ergebnisse.
Alle Ideen für jede Größe und Farbgebung über screenshot Ich beabsichtige zu benutzen?
Update: Bitte beenden Sie die Frage ausweichen und was darauf hindeutet, dass ich das nicht fragen sollte und mit UINavigationBar werden. Meine App ist Instapaper Pro. Es zeigt nur einen unteren Symbolleiste (um Platz zu sparen und lesbaren Content-Bereich maximieren), und ich wünsche eine Pfeil nach links-förmigen setzen Zurück-Button unten.
Sie mich sagen, dass ich nicht dieses tun müssen, ist keine Antwort und schon gar nicht verdient eine Prämie.
Lösung
habe ich die folgende psd, dass ich abgeleitet von http://www.teehanlax.com / blog /? p = 447
http://www.chrisandtennille.com/pictures/backbutton.psd
ich dann nur eine benutzerdefinierte UIView erstellt, die ich in der Custom Eigenschaft des Symbolleiste Elements verwenden.
funktioniert gut für mich.
Edit: Wie PrairieHippo weist darauf hin, , maralbjo festgestellt, dass die folgenden, einfacher Code mit dem Trick (erfordert in Bündel benutzerdefiniertes Bild ) sollte mit dieser Antwort kombiniert werden. So, hier ist zusätzlicher Code:
// 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];
Andere Tipps
Die Unicode-Methode
Ich denke, es ist viel einfacher, nur ein Unicode-Zeichen zu verwenden, um den Job zu erledigen. Sie können entweder durch Pfeile schauen durch googeln Unicode Triangles oder < a href = "http://www.fileformat.info/info/unicode/block/arrows/list.htm" rel = "nofollow noreferrer"> Unicode Arrows . Beginnend mit iOS6 Apfel veränderte den Charakter zu sein ein Emoji-Zeichen mit einer Grenze. So deaktivieren Sie die Grenze füge ich die 0xFE0E Unicode Variation Selector .
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;
Der Code-Block ist nur für die Demo. Es wäre in jeder Taste arbeiten, die eine NSString akzeptiert.
Für eine vollständige Liste von Zeichen, Google-Suche nach Unicode-Zeichen und das, was Sie wollen. Hier ist der Eintrag für schwarz links gerichtetes Dreieck .
Ergebnis
ACHTUNG: Es gibt Berichte, dass dies auf nicht iOS funktioniert 6. Dies könnte nur ältere Versionen des Betriebssystems arbeiten. Offenbar mindestens ein Entwickler ihre App für die Verwendung dieses Tricks (siehe Kommentare) abgelehnt hatte. Benutzung auf eigene Gefahr. Unter Verwendung eines Bildes (siehe oben antworten) könnte eine sicherere Lösung sein.
Dies kann ohne Zusatz in Ihrer eigenen Bilddatei durchgeführt wird unter Verwendung von sekr1t Knopf 101 die richtige Form zu bringen. Für mich war Bezifferung der Trick, dass ich initWithCustomView die BarButtonItem schaffen nutzen könnten. Ich brauchte persönlich dies für eine dynamische navbar eher als ein toolbar, aber ich getestet es mit einer Symbolleiste und der Code ist fast das gleiche:
// 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;
Wenn Sie tun dies auf einer Symbolleiste, die Sie zwicken müssen werden, wie Sie die Einstellungen festlegen, aber das hängt von dem Rest des Codes und ich lasse das als eine Übung für den Leser. : P Diese Probe für mich gearbeitet (kompilierte & run)
.Blah blah, lesen die HIG, verwenden Sie keine undokumentierten Features, und das alles. Es gibt nur sechs unterstützte Tastentypen und das ist nicht einer von ihnen.
Zunächst einmal müssen Sie ein Bild von der Rückseite Button. Früher habe ich eine nette App Extractor genannt, die alle Grafiken von iPhone extrahiert.
In iOS7 ich es geschafft, das Bild namens UINavigationBarBackIndicatorDefault abzurufen und es war in der Farbe schwarz, da ich einen roten Farbton brauchte ich die Farbe rot mit Gimp ändern.
EDIT:
Wie erwähnt von btate in seinem Kommentar, gibt es keine Notwendigkeit, die Farbe mit dem Bild-Editor zu ändern. Der folgende Code sollte es tun:
imageView.tint = [UIColor redColor];
imageView.image = [[UIImage imageNamed:@"UINavigationBarBackIndicatorDefault"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
Dann habe ich eine Ansicht, die einen Imageview mit dem Pfeil enthält, ein Etikett mit dem kundenspezifischen Text und auf der Oberseite der Ansicht, die ich auf eine Schaltfläche mit einer Aktion habe. Dann habe ich eine einfache Animation (Fading und Übersetzung).
Der folgende Code simuliert das Verhalten der Zurück-Taste mit Animation.
-(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{
}
EDIT:
Statt die Schaltfläche Hinzufügen, meiner Meinung nach der bessere Ansatz ist es, eine Gestenerkenner zu verwenden.
UITapGestureRecognizer* tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleBack:)];
[view addGestureRecognizer:tap];
[view setUserInteractionEnabled:YES];
Ich bin mir nicht sicher, ob dies funktionieren würde, aber man könnte versuchen, eine UINavigationController mit den Standardeinstellungen Erstellen der Schaltfläche zu erstellen, auf die Schaltfläche in der Navigations Controllers subview Hierarchie finden, rufen removeFromSuperview auf sie, zerstören sie die Navigationssteuerung, und fügen Sie dann den Knopf als Subview Ihrer Symbolleiste. Möglicherweise müssen Sie auch retain und die Taste vor removeFromSuperview Aufruf (und release es dann, nachdem er als Subview Ihrer Symbolleiste hinzufügen), es zu vermeiden während des Prozesses ausgeplant werden.
Um einen UIButton mit einem Pfeil ziemlich nah dran zu machen (ich bin kein Designer;) an dem iOS-7-System zurück Pfeil:
Standard:
Apple-SD Gothic Neo
In Xcode:
- Fokus auf dem Titel Wertfeld der Taste (oder eine andere Ansicht / Steuerung mit Textinhalt)
- Öffnen Bearbeiten -> Sonderzeichen
- die Gruppe Klammerung Wählen und doppelklicken Sie auf die ‚<‘ Zeichen
- Schrift zu: Apple-SD Gothic Neo, Regular mit der gewünschten Größe (zum Beispiel 20)
- Farbe ändern, wie Sie möchten
@ staticVoidMan Antwort Back-wie Pfeil auf iOS 7
Wenn Sie nicht wollen, mit Bilddateien stören, kann die Pfeilung in einer UIView Unterklasse mit dem folgenden Code gezogen werden:
- (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);
}
, wo der Pfeil Blick auf eine Breite von 6,0 proportional ist und eine Höhe von 10,0
self.navigationItem.leftBarButtonItem = self.navigationItem.backBarButtonItem;
Funktioniert für mich. Früher habe ich das, wenn ich mehr Registerkarten habe dann auf der Tab-Leiste passen könnte, und ein View-Controller aus der „Mehr“ überwog die leftBarButtonItem in seiner viewDidLoad gedrückt.
Sie können die Quellbilder finden, indem sie von Other.artwork in UIKit $ {} SDKROOT /System/Library/Frameworks/UIKit.framework/Other.artwork extrahieren. Die Modding-Community hat einige Tools zum Extrahieren von ihnen, hier . Sobald Sie das Bild extrahieren können Sie einen Code schreiben Sie es als notwendig umfärben und als die Schaltfläche Bild gesetzt. Unabhängig davon, ob Sie tatsächlich so etwas versenden (da Sie Kunstwerk abgeleitet werden Embedding) könnte ein wenig heikel sein, so vielleicht haben Sie zu einem Anwalt sprechen wollen.
Die Three20 Bibliothek hat einen Weg, dies zu tun:
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;
Ich fand, dass die folgende Verwendung von einfachen Code der Trick (erfordert benutzerdefiniertes Bild in Bündel):
// 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];
Hier ist, was ich nach der Suche durch all diese Lösungen und andere am Ende tun. Es verwendet eine dehnbare PNGs aus den UIKit Bilder extrahiert. So können Sie den Text festlegen können, was Sie liek
// 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;
Es ist einfach, mit dem zu tun Interface Builder in Xcode 5.x
-
verwenden Toolbar und Bar-Taste Item Objektbibliothek
-
in Taste Attribute Inspektoren Bearbeiten Bild mit Ihre Zurück-Taste Bild
Fertig!
Ich habe versucht, das Gleiche zu tun, aber ich wollte die Zurück-Button in der Navigationsleiste sein. (Ich tatsächlich eine Zurück-Taste benötigt, die mehr als nur zurück tun würde, so hatte ich die leftBarButtonItem Eigenschaft verwenden). Ich habe versucht, was Andrews vorgeschlagen, aber in der Navigationsleiste wäre es nicht so aussehen, es sollte, wie der UIButton war irgendwie zu einem UIBarButtonItem gegossen.
Aber ich fand einen Weg, dies zu umgehen. Ich habe eigentlich nur eine UIView unter dem UIButton und die Custom für die UIBarButtonItem gesetzt. Hier ist der Code, wenn jemand es braucht:
// 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]];
Um ein Bild für die UIToolbar zu erstellen, ein png in Photoshop machen und, wo immer es irgendeine Farbe, die es es weiß setzt, und wo es alpha = 0, dann läßt sie es allein.
Das SDK tatsächlich setzen ist der Rahmen um das Symbol, das Sie gemacht haben und verwandelt es weiß, ohne dass Sie etwas zu tun.
Sehen Sie, das ist, was ich in Photoshop für meine Vorwärts-Taste gemacht (natürlich es für Back-Button um tauschen):
und das ist, was es sah aus wie in Interface Builder
Lösung ohne eine png zu verwenden. Auf dieser Grundlage SO beantworten: den kleinen Pfeil auf der rechten Seite einer Zelle in einem iPhone Tableview Zelle Hinzufügen
Sie einfach die UITableViewCell Spiegeln horizontal!
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];
Wenn Sie vermeiden wollen, es selbst zeichnen, könnten Sie die undokumentierte-Klasse verwenden: Navigationstaste mit Stil 1. Dies könnte natürlich daran hindern, Ihren Antrag genehmigt wird ... / John
Nun, Sie nicht eine andere Taste für jede Größe haben müssen, Sie [UIImage stretchableImageWithLeftCapWidth:topCapHeight:] verwenden können, aber das einzige, was ich gefunden habe, ist benutzerdefinierte Bilder.
Ich hatte ein ähnliches Problem, und kommen aus einer Bibliothek pbutton . Und die Probe ist die Rückseite Navigationstaste wie Taste, die überall dort eingesetzt werden können, wie eine kundenspezifische Taste.
So etwas wie folgt aus:
Beispiel in Swift 3, mit einem früheren und einem nächsten Schaltfläche oben rechts.
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]
Swift
// 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
Versuchen Sie dies. Ich bin sicher, dass Sie nicht über eine Zurück-Taste Bild erstellen müssen eine solche.
UIBarButtonItem *backButton = [[UIBarButtonItem alloc] initWithTitle:@"Back"
style:UIBarButtonItemStyleBordered
target:self
action:@selector(yourSelectorGoesHere:)];
self.navigationItem.backBarButtonItem = backButton;
Das ist alles, was Sie tun müssen:)
Warum tun Sie das? Wenn Sie wollen etwas, das wie ein Navigationsleiste aussieht, verwenden UINavigationBar.
Symbolleiste haben spezifischen visuellen Stil mit ihnen verbunden ist. Das Human Interface Guidelines für den iPhone Zustand:
erscheint Eine Werkzeugleiste am unteren Rand des Bildschirms und enthält Schaltflächen, die Aktionen in Bezug auf Objekte in der aktuellen Ansicht auszuführen.
Es gibt dann mehrere visuelle Beispiele von etwa quadratische Symbole ohne Text. Ich möchte Sie bitten, die HIG auf diesem zu folgen.
