Пользовательская панель навигации

Question

Я ползал Dribble и нашел прикрепленный дизайн. Мне было интересно, как сделать пользовательскую панель навигации, как это. Я имею в виду, как один раз создать панель навигации и неявно использовать ее для всех контроллеров представления.

Я думал о том, чтобы иметь своего рода корневой контроллер представления и наследовать для других контроллеров представления, но я не знаю, как это сделать.

Любая идея или ссылка будут доступны!

Приветствие.

Кирилл

Answer 1

Благодаря iOS5 вы теперь можете настраивать внешний вид UINavigationBar без необходимости создавать подклассы или создавать категорию.

Следующий блок кода (поместите его в applicationDidFinishLoading: метод) изменит UINavigationBar длявсе приложение к любому изображению, которое вы ему даете.

Обратите внимание, это будет работать ТОЛЬКО в iOS5

[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:@"nav bar.png"] forBarMetrics:UIBarMetricsDefault];

Однако вы такжевозможность изменять внешний вид одной UINavigationBar в зависимости от того, в каком контроллере представления вы находитесь, используя следующий код в viewDidLoad.

[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"nav bar.png"] forBarMetrics:UIBarMetricsDefault];

Приведенный выше код обсуждается исключительноновые способы настроить внешний вид UINavigationBar благодаря iOS5.Тем не менее, здесь не обсуждается способ реализации кнопок.

Однако добавление кнопок - это совсем другая игра.Для этого я бы порекомендовал создать подкласс UINavigationBar, а затем добавить туда кнопки, где это необходимо.Возможно, вам даже не подойдут просто стандартные UINavigationBar, но пользовательские UIBarButtonItem s, которые запускают определенный вид.

Например:

UIView *rightButton = [[[UIView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, 30.0f, 30.0f)] autorelease];
[rightButton addSubview:[UIImage imageNamed:@"rightButtonImage.png"]];

UIBarButtonItem *rightButtonItem = [[[UIBarButtonItem alloc] initWithCustomView:rightButton] autorelease];
[rightButtonItem setAction:@selector(rightButtonAction:)];

Я не проверял этокод, так что это не решение для копирования / вставки, но оно дает вам представление о том, что необходимо сделать для выполнения «нестандартных» UIBarButtonItems.

Удачи!

Answer 2

В более старых версиях iOS вы должны создать подкласс UINavigationBar, т.е.

@interface CustomNavigationBar : UINavigationBar
@end

@implementation CustomNavigationBar

- (id)initWithCoder:(NSCoder *)aDecoder {
    self = [super initWithCoder:aDecoder];
    if (self) {
        self.opaque = YES;
        self.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"CustomBackground"]];
    }
    return self;
}

- (void)drawRect:(CGRect)rect {
    // Skip standard bar drawing
}

@end

Чтобы использовать пользовательскую панель навигации в вашем контроллере представления, вы должны изменить стандартное имя класса на CustomNavigationBar в XIB.

Кроме того, вы можете установить пользовательскую панель навигации программно:

UIViewController *tempController = [[[UIViewController alloc] init] autorelease];
UINavigationController *navigationController = [[[UINavigationController alloc] initWithRootViewController:tempController] autorelease];

NSData *archive = [NSKeyedArchiver archivedDataWithRootObject:navigationController];
NSKeyedUnarchiver *unarchiver = [[[NSKeyedUnarchiver alloc] initForReadingWithData:archive] autorelease];
[unarchiver setClass:[CustomNavigationBar class] forClassName:@"UINavigationBar"];
UINavigationController *customNavigationController = [unarchiver decodeObjectForKey:@"root"];

UIViewController *contentController = [[[ContentViewController alloc] init] autorelease];
customNavigationController.viewControllers = [NSArray arrayWithObject:contentController];

Теперь customNavigationController имеет настраиваемую панель навигации.

Answer 3

установить пользовательский фон для панели навигации

UIImage *navBackground =[[UIImage imageNamed:@"navbarBackground"] 
                 resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UINavigationBar appearance] setBackgroundImage:navBackground forBarMetrics:UIBarMetricsDefault];

, затем в вашем контроллере представления установите пользовательские представления для left, rightBarButtons и title.

self.navigationItem.titleView = customTitleView;
self.navigationItem.leftBarButtonItem = customBarButton;
self.navigationItem.rightBarButtonItem = customBarButton2;

Answer 4

Используя Category, добавьте код ниже в ваш файл делегата (.m)

@implementation UINavigationBar (UINavigationBarCategory)

- (void)drawRect:(CGRect)rect
{
    UIImage *navBg = [UIImage imageNamed:@"NavBar.png"];
    [navBg drawInRect:CGRectMake(0, 0, 320, 44)];
}
@end

Edit:

Использование Category не очень хороший способ, я написал демо без использования Category, нажмите здесь .

Answer 5

Вам потребуется создать собственный подкласс UINavigationBar и использовать его там, где вам нужен навигационный контроллер.

В этом пользовательском классе вы будете рисовать фон, кнопки, текст и т. Д.

---

Обновление

На самом деле, если присмотреться к этому примеру, он выглядит как UIToolBar. Для кнопок можно назначить методы навигации, такие как popViewController: и т. Д. Для «Подтверждение информации» и индикатора хода выполнения можно использовать метку и изображение. Для правой кнопки это просто рисунок.

Конечно, приведенный вами пример - это просто концепция, а не реальное приложение. Но с некоторой креативностью, несколькими часами кодирования и еще несколькими часами графического дизайна, вы можете достичь того же интерфейса.

Answer 6

После долгих исследований одного из моих недавних проектов в IOS. Я решил использовать подкласс для настройки только панели навигации без использования UINavigationController.

import UIKit

class CustomNavigationBar: UINavigationBar {
    override func awakeFromNib() {
        super.awakeFromNib()
        self.setBackgroundImageOfNavBar(imagenName: "navbar.jpg")
        self.setShadowImageOfNavBar(imagenName: "")
        self.setTitleAttribute()
        self.setBarAsTranslucent()
    }
    func setBackgroundImageOfNavBar(imagenName:String){
        //pass the image name and set the image here
         self.setBackgroundImage(UIImage(named: imagenName), for: .default)
        //if you want white backgroung just remove the image
       // self.setBackgroundImage(UIImage(), for: .default)
        //if you want to set backgroung color
        self.backgroundColor = UIColor.clear
    }

    func setShadowImageOfNavBar(imagenName:String){
        //pass the image name and set the image here
        // self.shadowImage = UIImage(named: imagenName)
        //if you want white backgroung just remove the image
        self.shadowImage = UIImage()
    }
    func setTitleAttribute(){
        //add NSAttributedStringKey as you want to customize title Color and font provide your app font family name open below commented code
        //        let textAttributes = [NSAttributedStringKey.foregroundColor:UIColor.black,NSAttributedStringKey.font: UIFont(name: "Enter Your App Font Name", size: 18)!]

        //set only title color of navigation bar by below code
        let textAttributes = [NSAttributedStringKey.foregroundColor:#colorLiteral(red: 0.8784313725, green: 0.1882352941, blue: 0.3254901961, alpha: 1)]
        self.titleTextAttributes = textAttributes
    }
    func setBarAsTranslucent(){
        self.isTranslucent = false
    }
}

Я поделился ссылкой, которая делает много пользовательских вещей , включая добавление фоновых изображений, текста и т. Д.

Answer 7

Вы можете использовать стандартный UINavigationController и скрыть UINavigationBar.

Затем создайте свой собственный подкласс UIViewController, который имеет все элементы навигации, а затем представление сгибающегося размера, куда направляется содержимое. Сделайте все ваши классы подклассами этого элемента и нарисуйте в представлении. Кнопка просто должна вызвать [self.navigationController popViewControllerAnimated:YES], а UILabel при просмотре просто должна установить текст self.title.