导航栏的相关设置

1、设置导航栏标题的字体颜色

   
NSDictionary *dic = @{NSForegroundColorAttributeName:[UIColor whiteColor],
                          NSFontAttributeName:[UIFont systemFontOfSize:16]};
    

    [self.navigationBar setTitleTextAttributes:dic];


 2、状态栏的相关设置

-(UIStatusBarStyle)preferredStatusBarStyle {
    return  UIStatusBarStyleLightContent;
    

}


3、使用自定义的视图创建BarButtonItem

方法一:

//右边按钮设置

UIButton *rightbutton = [UIButton buttonWithType:UIButtonTypeCustom];

rightbutton.frame = CGRectMake(0, 0, 30, 30);

UIBarButtonItem *rightButtonItem = [[UIBarButtonItem alloc] initWithCustomView:rightbutton];
    // 在视图上加载

    self.navigationItem.rightBarButtonItem = rightButtonItem;


//左边按钮设置

UIButton *leftbutton = [UIButton buttonWithType:UIButtonTypeCustom];

leftbutton.frame = CGRectMake(0,  0, 30, 30);

UIBarButtonItem *leftButtonItem = [[UIBarButtonItem alloc] initWithCustomView:leftbutton];
    // 在视图上加载
    self.navigationItem.leftBarButtonItem = leftButtonItem;

方法二:

UIBarButtonItem *rightItem = [[UIBarButtonItemalloc]

                        initWithTitle:@"item"
                                style:UIBarButtonItemStylePlain
                                target:self
                                action:@selector(buttonAction)];

4、在标签控制器中引入自定义的导航控制器

UINavigationController *nav = [[ZHNavigationController alloc] initWithRootViewController:vc];
    

    [self addChildViewController:nav];

5、导航栏样式

// 设置导航栏的风格

navigationController.navigationBar.barStyle = UIBarStyleBlack;

// 导航栏设置为透明

navigationController.navigationBar.translucent = YES;

// 设置导航栏的颜色

navigationController.navigationBar.tintColor = [UIColor blueColor];

// 设置背景图片

navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"1"

       forBarMetrics:UIBarMetricsDefault;

6、当前子控制器界面导航栏的标题以及对应返回标题的设置
    self.navigationItem.title=@"第一个界面";
    self.navigationItem.backBarButtonItem=[[UIBarButtonItemalloc]initWithTitle:@"返回一" style:UIBarButtonItemStylePlain target:nilaction:nil];
7、自定义导航栏按钮的间距设置:
button.contentEdgeInsets = UIEdgeInsetsMake(0, -10, 0, 0);


### 如何在 UniApp 中配置自定义导航栏 #### 配置全局隐藏默认导航栏 为了实现自定义导航栏,在项目中通常先要隐藏默认的导航栏。这一步骤可以通过特定配置完成,适用于整个应用范围内的页面[^1]。 #### 修改 `pages.json` 文件以启用自定义导航样式 对于微信小程序而言,要在 `pages.json` 文件里指定 `"navigationStyle": "custom"` 来开启自定义导航栏功能。此设置位于各个页面路径下的 style 属性之中,如下所示: ```json { "pages": [ { "path": "pages/index/index", "style": { "navigationStyle": "custom" } } ] } ``` 这段 JSON 片段展示了如何针对单个页面(这里是首页)设定自定义导航风格[^2]。 #### 实现自定义导航栏交互事件 当涉及具体的操作如点击保存按钮时,则可以在 Vue 组件的方法部分编写相应逻辑响应这些动作。例如通过监听 `onNavigationBarButtonTap()` 方法捕捉到用户的点击行为并执行相应的业务流程处理[^3]。 #### 获取设备信息辅助布局设计 考虑到不同平台间可能存在差异化的显示效果,可以利用 uni-app 提供的一系列 API 函数来取得当前运行环境的相关参数,比如屏幕尺寸或者状态栏高度等重要数据,从而更好地调整自定义导航栏的设计适应各种终端设备[^4]。 #### 结合状态管理控制动态内容展示 如果应用程序中有基于用户身份或其他条件变化而需改变界面元素的需求,那么借助 Pinia 或 Vuex 这样的状态管理模式可以帮助维护必要的变量(像 role ID),进而影响到导航栏上某些控件的状态或可见性[^5]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值