[iOS]關於檢視下拉選單的猜想
日常使用App過程中經常看到下拉選單的使用。例如:
阿里郵箱客戶端頂部:
網易郵箱大師客戶端頂部:
企鵝群:
對此做了以下實現方案的思考。
1、給navigationBar新增一個可以展開的檢視。
2、給viewController新增一個可以下拉展開的檢視。
1、給navigationBar新增一個可以展開的檢視。
git:https://github.com/KKLater/UINavigationBar-LATNavigationSpreadViewCategory
1.1演示
1.2使用
//直接設定navigationBar的spreadView屬性,來設定展開檢視
self.navigationController.navigationBar.spreadView = self.navigationSpreadView;
//可以用過navigationBar的isSpreadViewShow屬性判定檢視是否處於展開的狀態
if (self.navigationController.navigationBar.isSpreadViewShow) {
//隱藏檢視
[self.navigationController.navigationBar hideSpreadView];
} else {
//展開檢視
[self.navigationController.navigationBar showSpreadView];
}
2、給viewController新增一個可以下拉展開的檢視。
Git:https://github.com/KKLater/UIViewController-LATSpreadViewCategory
2.1演示
2.1.1 普通用法
2.2.2 自定義背景檢視、
2.2使用
2.2.1顯示
直接呼叫顯示方法
/**
* spreadView顯示
*
* @param animation 顯示過程block
* @param completed 顯示結束block
*/
- (void)showSpreadViewAnimation:(void(^)())animation completed:(void(^)())completed;
可以通過設定animation來執行顯示過程中的動畫,設定completed來設定顯示結束的動畫。例如:
__weak typeof(self)weakSelf = self;
[self showSpreadViewAnimation:^{
weakSelf.titleButton.selected = !weakSelf.isSpreadViewShow;
} completed:^{
NSLog(@"isShow");
}];
2.2.2 隱藏
直接呼叫隱藏方法
/**
* spreadView隱藏
*
* @param animation 隱藏過程block
* @param completed 隱藏結束block
*/
- (void)hideSpreadViewAnimation:(void(^)())animation completed:(void(^)())completed;
可以通過設定animation來執行消失過程中的動畫,設定completed來設定檢視隱藏結束的動畫。例如:
__weak typeof(self)weakSelf = self;
[self hideSpreadViewAnimation:^{
weakSelf.titleButton.selected = !weakSelf.isSpreadViewShow;
} completed:^{
NSLog(@"isHide");
}];
注意:過程中的animation和結束的completed與category內的程式碼是相互獨立的。
2.2.3 獲取當前狀態(顯示或者隱藏)
通過
/**
* 檢視是否處於展開的狀態
*/
@property (assign, nonatomic, readonly) BOOL isSpreadViewShow;
屬性可以獲取當前展示狀態。
2.2.4 設定spreadView
直接設定屬性@property (strong, nonatomic) UIView *spreadView;來設定spreadView。在設定屬性前,需要將spreadView的各種屬性設定完成。例如frame。
self.navigationSpreadView.frame = CGRectMake(0, 64, CGRectGetWidth(self.view.frame), 100);
self.spreadView = self.navigationSpreadView;
2.2.5 自定義backView
已經預設封裝的backView是一個黑色,alpha為0.3的檢視。未新增點選消失的手勢。
不單獨設定backView,可使用已經封裝的backView,不需要做任何處理。
如果需要設定特殊的backView,可以設定@property (strong, nonatomic) UIView *spreadBackView;屬性來設定。同樣也可以給spreadBackView新增手勢。例如:
//自定義背景圖
UIView *back = [[UIView alloc] initWithFrame:self.view.bounds];
back.backgroundColor = [UIColor redColor];
self.spreadBackView = back;
//給背景檢視新增手勢
UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tap)];
[self.spreadBackView addGestureRecognizer:tapGesture];
手勢對應呼叫隱藏方法即可。
__weak typeof(self)weakSelf = self;
[self hideSpreadViewAnimation:^{
weakSelf.titleButton.selected = !weakSelf.isSpreadViewShow;
} completed:^{
NSLog(@"isShow");
}];
期望:暫時只是新增了spreadView功能。並未設定出現的方向。後期期望新增展開檢視的出現方向。
相關文章
- 關於下拉選單查詢資料庫的問題資料庫
- Vue.js自定義下拉選單,如何實現在下拉選單區域外點選即可關閉下拉選單的功能Vue.js
- jQuery select下拉選單的相關操作jQuery
- 下拉選單
- 關於新增修改時如何獲取下拉選單資訊方法?
- 關於如何時空旅行的猜想
- vue下拉選單Vue
- html - 下拉選單HTML
- Spinner下拉選單
- 下拉選單「點選外面關閉」的終極解決方案
- 關於element-ui中的下拉選單重新整理恢復預設值UI
- iOS開發: 使用UITableView製作N級下拉選單iOSUIView
- Bootstrap下拉選單disabledboot
- 關於開發檢視
- 檢視下拉選單接收控制器傳來的值,並選中下拉類表中該值相對應的選項(新手筆記,請各位大神指教)筆記
- android短視訊開發,自定義下拉選單Android
- 點選文字框彈出可檢索下拉選單程式碼例項
- antd design Menu選單下拉回撥以及下拉選單時只能顯示一個列表,其餘關閉
- kendoUI 多選下拉選單 kendoMultiSelectUI
- JavaScript帶下拉選單的文字框JavaScript
- CSS 二級下拉選單CSS
- HTML select下拉選單HTML
- HTML select 下拉選單HTML
- CSS二級下拉選單CSS
- jQuery 二級下拉選單jQuery
- DIV下拉式選單(轉)
- 關於oracle的jobs的兩個檢視Oracle
- 關於記憶體異常的一個猜想記憶體
- 關於 VC 編譯的猜想與試驗 (轉)編譯
- 選中select下拉選單項提交表單
- 關於SGA的常用動態效能檢視
- 【PB】動態新增資料視窗列中下拉選單的內容
- 8.1關於動態效能檢視
- jQuery 美化select下拉選單jQuery
- 圓角select下拉選單
- Bootstrap3系列:下拉選單boot
- select下拉選單 change事件事件
- bootstrap36-Bootstrap下拉選單boot