码迷,mamicode.com
首页 > 移动开发 > 详细

<iOS 导航栏>第一节:导航栏透明方法实现代码

时间:2017-07-10 23:52:02      阅读:543      评论:0      收藏:0      [点我收藏+]

标签:ssi   strongify   改变   mode   后退   port   color   scons   默认   

 
说下导航栏的透明方法:
 
很多应用需要导航栏随着向上滑动,逐渐从透明变成不透明,很炫酷,大部分应用都在使用导航栏渐变效果,现附上代码然后直接将实现,一会讲下如何来实现,这一部分直接上代码。
 
先附上代码:
 
方法声明:
 
 
#import <UIKit/UIKit.h>

@interface IDSNavBarView : UIView

- (
instancetype)initWithFrame:(CGRect)frame titleImg:(UIImage *)aTitleImg;

- (
UILabel *)titleLabel;

- (
void)animateByOffsetY:(CGFloat)offsety;

/**
 
语音房间新增方法,用于外部触发更改左右图片和标题

 @param title
标题内容
 */

- (
void)changeButtonImage;

- (
void)changeButtonImagelight;

- (
void)changeTitleName:(NSString *)title;

@property (nonatomic, strong) NSString *backImageName;

@property (nonatomic, strong) NSString *reportImageName;

@property (nonatomic, strong) NSString *backImageName_light;

@property (nonatomic, strong) NSString *reportImageName_light;

@property (nonatomic, copy) dispatch_block_t onBackActionBlock;

@property (nonatomic, copy) dispatch_block_t onReportBlock;

@property (nonatomic, assign) BOOL enableBackBtn;

@property (nonatomic, assign) BOOL enableReportBtn;

@property (nonatomic, assign) BOOL enableTransparent;

@end
 
 
 
实现:
 
 

#import "IDSNavBarView.h"

@interfaceIDSNavBarView ()

@property (nonatomic, strong) UILabel *titleLabel;

@property (nonatomic, strong) UIImageView *titleImgView;

@property (nonatomic, strong) UIImage *titleImg;

@property (nonatomic, strong) UIButton *backBtn;

@property (nonatomic, strong) UIButton *reportBtn;

@property (nonatomic, strong) UIView *backgroundView;

@property (nonatomic, strong) UIView *maskLine;

@end


@implementation IDSNavBarView

- (
instancetype)initWithFrame:(CGRect)frame
{
   
return [selfinitWithFrame:frame titleImg:nil];
}

- (
instancetype)initWithFrame:(CGRect)frame titleImg:(UIImage *)aTitleImg
{
   
self = [superinitWithFrame:frame];
   
   
if (self) {
       
       
_titleImg = aTitleImg;
       
        [
selfsetupViews];
       
       
/// 默认不显示
       
self.alpha = 1;
    }
   
   
returnself;
}

//改变导航栏透明按钮时的显示状态
- (
void)changeButtonImage
{
   
UIImage *backImg = ImageNamed(@"ic_global_return_light");
   
if (!IS_NS_STRING_EMPTY(self.backImageName)) {
        backImg =
ImageNamed(self.backImageName);
    }
    [
self.backBtn setImage:backImg forState:UIControlStateNormal];
    [
self.backBtn setImage:backImg forState:UIControlStateHighlighted];
   
   
UIImage *reportImg = ImageNamed(@"ic_navbar_point_light");
   
if (!IS_NS_STRING_EMPTY(self.reportImageName)) {
        reportImg =
ImageNamed(self.reportImageName);
    }
    [
self.reportBtn setImage:reportImg forState:UIControlStateNormal];
    [
self.reportBtn setImage:reportImg forState:UIControlStateHighlighted];
}

//改变导航栏透明按钮滑到后期改变时的显示状态(不声明代表不改变按钮状态)
- (
void)changeButtonImagelight
{
   
UIImage *backImg = ImageNamed(@"ic_global_return");
   
if (!IS_NS_STRING_EMPTY(self.backImageName_light)) {
        backImg =
ImageNamed(self.backImageName_light);
    }
    [
self.backBtnsetImage:backImg forState:UIControlStateNormal];
   
   
UIImage *reportImg = ImageNamed(@"ic_navbar_point_dark");
   
if (!IS_NS_STRING_EMPTY(self.reportImageName_light)) {
        reportImg =
ImageNamed(self.reportImageName_light);
    }
    [
self.reportBtn setImage:reportImg forState:UIControlStateNormal];
}

//使用此方法自定义标题label
- (
void)changeTitleName:(NSString *)title
{
   
if (!IS_NS_STRING_EMPTY(title)) {
       
self.titleLabel.alpha = 1;
       
self.titleLabel.textColor = NF_Color_C1;
       
self.titleLabel.text = title;
    }
    [
self bringSubviewToFront:self.titleLabel];
}

//透明位移,按照滚动的位移使导航栏渐渐从透明到非透明状态
- (
void)animateByOffsetY:(CGFloat)offsety
{
   
CGFloat fitHeight = 156;
   
self.alpha = 1;
   
self.backgroundView.alpha = offsety/fitHeight;
   
self.titleLabel.alpha = offsety/fitHeight;
   
self.maskLine.alpha = offsety/fitHeight;
   
   
   
if (self.backgroundView.alpha > 0.7) {
        [
self changeButtonImagelight];
    }
   
else {
        [
self changeButtonImage];
    }
}

//导航栏左侧返回按钮按钮
- (
void)doBackAction:(id)sender
{
   
if (self.onBackActionBlock) {
       
self.onBackActionBlock();
    }
}

//导航栏右侧按钮按钮
- (
void)doReportAction:(id)sender
{
   
if (self.onReportBlock) {
       
self.onReportBlock();
    }
}

#pragma mark - Setup Views.

//自定义导航栏设置,若加入_enableTransparent属性,导航栏则显示透明,否则不显示透明状态
- (
void)setupViews
{
   
self.titleLabel.backgroundColor = [UIColorclearColor];
   
self.backgroundColor = [UIColorclearColor];
   
self.backgroundView = [[UIViewalloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 64)];
   
self.backgroundView.backgroundColor = [UIColorwhiteColor];
    [
selfaddSubview:self.backgroundView];
   
//self.backgroundColor = NF_Color_C1;
   
   
self.clipsToBounds = YES;
   
   
if (nil == self.titleImg) {
       
       
/// 添加 title.
       
        {
            [
self addSubview:self.titleLabel];
            [
self.titleLabelmas_makeConstraints:^(MASConstraintMaker *make) {
                make.
centerX.mas_equalTo(self.mas_centerX);
                make.
left.mas_equalTo(self).offset(50.0f);
                make.
right.mas_equalTo(self).offset(-50.0f);
                make.
centerY.mas_equalTo(self.mas_centerY).offset(5.0f);
            }];
        }
    }
   
else {
       
       
/// 设置image
        {
           
self.titleImgView.image = self.titleImg;
            [
self addSubview:self.titleImgView];
            [
self.titleImgViewmas_makeConstraints:^(MASConstraintMaker *make) {
                make.
size.mas_equalTo(CGSizeMake(self.width-20, self.height-10));
                make.
centerX.mas_equalTo(self.mas_centerX);
                make.
centerY.mas_equalTo(self.mas_centerY).mas_offset(6);
            }];
        }
    }
   
   
/// 添加分割线.
    {
       
_maskLine = [[UIViewalloc] init];
       
_maskLine.backgroundColor = NF_Color_C9;
       
self.maskLine.alpha = 0;
        [
selfaddSubview:_maskLine];
       
        [
_maskLinemas_makeConstraints:^(MASConstraintMaker *make) {
            make.
size.mas_equalTo(CGSizeMake(self.width, 0.5f));
            make.
left.with.right.with.bottom.mas_offset(0.f);
        }];
    }
   
   
if(_enableTransparent) {
       
self.backgroundView.alpha = 0;
       
self.titleLabel.alpha = 0;
       
self.maskLine.alpha = 0;
    }
   
else {
       
self.backgroundView.alpha = 1;
       
self.titleLabel.alpha = 1;
       
self.maskLine.alpha = 1;
    }
}

//set方法声明,通过声明 BOOL 变量enableBackBtn 来表明是否需要后退按键
- (
void)setEnableBackBtn:(BOOL)enableBackBtn
{
   
if (![self.backBtnsuperview]) {
        [
self addSubview:self.backBtn];
        [
self.backBtnmas_makeConstraints:^(MASConstraintMaker *make) {
           
//make.size.mas_equalTo(CGSizeMake(self.backBtn.imageView.image.size.width, self.backBtn.imageView.image.size.height));
            make.
size.mas_equalTo(CGSizeMake(50, 50));
            make.
left.mas_equalTo(self).mas_offset(0.f);
            make.
centerY.mas_equalTo(self.mas_centerY).mas_offset(6.f);
        }];
    }
   
   
if (enableBackBtn) {
       
self.backBtn.hidden = NO;
    }
   
else {
       
self.backBtn.hidden = YES;
    }
}

//set方法声明,通过声明 BOOL 变量透明来表明是否需要后退按键
- (
void)setEnableTransparent:(BOOL)enableTransparent
{
   
if (enableTransparent) {
       
self.backgroundView.alpha = 0;
       
self.titleLabel.alpha = 0;
       
self.maskLine.alpha = 0;
    }
   
else {
       
self.backgroundView.alpha = 1;
       
self.titleLabel.alpha = 1;
       
self.maskLine.alpha = 1;
    }
}

//set方法声明,是否需要右键
- (
void)setEnableReportBtn:(BOOL)enableReportBtn
{
   
if (![self.reportBtnsuperview]) {
        [
self addSubview:self.reportBtn];
        [
self.reportBtnmas_makeConstraints:^(MASConstraintMaker *make) {
           
//CGSize imgSize = self.reportBtn.imageView.image.size;
           
//make.size.mas_equalTo(CGSizeMake(imgSize.width, imgSize.height));
            make.
size.mas_equalTo(CGSizeMake(50, 50));
            make.
right.mas_equalTo(self).mas_offset(-0.f);
            make.
centerY.mas_equalTo(self.mas_centerY).mas_offset(6.f);
        }];
    }
   
   
if (enableReportBtn) {
       
self.reportBtn.hidden = NO;
    }
   
else {
       
self.reportBtn.hidden = YES;
    }
}

#pragma mark - Setter & Getter.

- (
UILabel *)titleLabel
{
   
if (nil == _titleLabel) {
       
_titleLabel = [[UILabelalloc] init];
    }
   
_titleLabel.font = [UIFontboldSystemFontOfSize:Near_Final_Font_T7];
   
_titleLabel.textAlignment = NSTextAlignmentCenter;
   
_titleLabel.numberOfLines = 1;
   
   
return_titleLabel;
}

- (
UIImageView *)titleImgView
{
   
if (nil == _titleImgView) {
       
_titleImgView = [[UIImageViewalloc] init];
       
_titleImgView.contentMode = UIViewContentModeScaleAspectFit;
    }
   
   
return_titleImgView;
}

- (
UIButton *)backBtn
{
   
if (nil == _backBtn) {
       
_backBtn = [UIButtonbuttonWithType:UIButtonTypeCustom];
       
UIImage *norImg = ImageNamed(@"ic_global_return_light");
       
if (!IS_NS_STRING_EMPTY(self.backImageName)) {
            norImg =
ImageNamed(self.backImageName);
        }
       
UIImage *highImg = [norImg cl_imageByApplyingAlpha:0.3f];
        [
_backBtn setImage:norImg forState:UIControlStateNormal];
        [
_backBtn setImage:highImg forState:UIControlStateHighlighted];
        [
_backBtn addTarget:selfaction:@selector(doBackAction:) forControlEvents:UIControlEventTouchUpInside];
    }
   
   
return_backBtn;
}

- (
UIButton *)reportBtn
{
   
if (nil == _reportBtn) {
       
_reportBtn = [UIButtonbuttonWithType:UIButtonTypeCustom];
       
UIImage *norImg = ImageNamed(@"ic_navbar_point_light");
       
if (!IS_NS_STRING_EMPTY(self.reportImageName)) {
            norImg =
ImageNamed(self.reportImageName);
        }
       
UIImage *highImg = [norImg cl_imageByApplyingAlpha:0.3f];
        [
_reportBtn setImage:norImg forState:UIControlStateNormal];
        [
_reportBtn setImage:highImg forState:UIControlStateHighlighted];
        [
_reportBtn addTarget:selfaction:@selector(doReportAction:) forControlEvents:UIControlEventTouchUpInside];
    }
   
   
return _reportBtn;


@end
 
引用的文件需要加入以下代码:
 
导航栏自定义声明:
 
 
    CGRect barFrame = CGRectMake(0, 0, SCREEN_WIDTH, 64);
   
_barView = [[IDSNavBarViewalloc] initWithFrame:barFrame];
   
self.barView.enableBackBtn = YES;
   
self.barView.enableTransparent = YES;
    @
weakify(self);
   
self.barView.onBackActionBlock = ^{
        @
strongify(self);
        [
self goBack];//返回操作,上个章节有讲解
    };
   

    
self.barView.enableReportBtn = YES;
    
self.barView.enableReportBtn = NO;

   
self.barView.onReportBlock = ^{
        @
strongify(self);
        [
self moreButtonAction]; //导航栏右侧按钮的点击方法
    };

 
 
 
 
 
在声明周期当中添加代码如下:
 
- (void)viewWillAppear:(BOOL)animated
{
    [
super viewWillAppear:animated];
    [
self.navigationController setNavigationBarHidden:YES animated:NO];
}
 
 
 
在文件的scrollView 中进行导航栏处理,因为要随着滑动,导航栏从透明变成非透明状态
 
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
   
// 处理导航栏
   
CGFloat distY = scrollView.contentOffset.y;
    [
self.barViewanimateByOffsetY:distY];
}
 
 
 
 
 

<iOS 导航栏>第一节:导航栏透明方法实现代码

标签:ssi   strongify   改变   mode   后退   port   color   scons   默认   

原文地址:http://www.cnblogs.com/firstrate/p/7147939.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!