全部产品
云市场

搜索栏组件

更新时间:2019-09-26 18:38:02

  • AUSearchBar 为 mPaaS 搜索栏控件 。
  • 该组件提供两种显示样式:
    • AUSearchBarStyleNormal:带取消按钮的搜索栏,参考全局搜索主页搜索栏。
    • AUSearchBarStyleDetail:带取消和返回按钮的搜索栏,参考全局搜索二级页面搜索栏。

效果图

依赖

AUSearchBar 的依赖如下:

  1. AntUI(iOS)
  2. 1.0.0.161108003457
  3. APCommonUI(iOS)
  4. 1.2.0.161108102201

接口说明

  1. @class AUSearchBar;
  2. @protocol AUSearchBarDelegate <NSObject>
  3. @optional
  4. #pragma mark - 对应 UITextField 的代理方法
  5. //
  6. - (BOOL)searchBarTextShouldBeginEditing:(AUSearchBar *)searchBar;
  7. //
  8. - (BOOL)searchBarTextShouldEndEditing:(AUSearchBar *)searchBar;
  9. // called when text starts editing
  10. - (void)searchBarTextDidBeginEditing:(AUSearchBar *)searchBar;
  11. // called when text ends editing
  12. - (void)searchBarTextDidEndEditing:(AUSearchBar *)searchBar;
  13. // called when text changes (including clear)
  14. - (void)searchBar:(AUSearchBar *)searchBar textDidChange:(NSString *)searchText;
  15. // called before text changes
  16. - (BOOL)searchBar:(AUSearchBar *)searchBar shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text;
  17. - (BOOL)searchBarShouldClear:(AUSearchBar *)searchBar;
  18. #pragma mark - 其他代理方法
  19. // 键盘搜索按钮点击后的回调
  20. - (void)searchBarSearchButtonClicked:(AUSearchBar *)searchBar;
  21. // 取消按钮点击后的回调
  22. - (void)searchBarCancelButtonClicked:(AUSearchBar *) searchBar;
  23. // 返回按钮点击后的回调(AUSearchBarStyleDetail 有效)
  24. - (void)searchBarBackButtonClicked:(AUSearchBar *)searchBar;
  25. // voice按钮点击后的回调(shouldShowVoiceButton 为 YES 时有效)
  26. - (void)searchBarOpenVoiceAssister:(AUSearchBar *)searchBar;
  27. @end
  28. typedef NS_ENUM(NSUInteger, AUSearchBarStyle) {
  29. AUSearchBarStyleNormal = 0,//normal
  30. AUSearchBarStyleDetail, //has back Button
  31. };
  32. /**
  33. 搜索栏控件(默认宽度和屏幕宽度一致,高度 44)
  34. */
  35. @interface AUSearchBar : UIView
  36. @property (nonatomic, strong) NSString *text; // 搜索框文本
  37. @property (nonatomic, assign) BOOL isSupportHanziMode; // 是否支持汉字边输入边搜索模式,默认为 YES
  38. @property (nonatomic, assign) AUSearchBarStyle style; // 搜索框样式
  39. @property (nonatomic, assign) BOOL shouldShowVoiceButton; // 是否显示 voice 按钮,默认为 NO
  40. @property (nonatomic, strong, readonly) UITextField *searchTextField; // 搜索框
  41. @property (nonatomic, weak) id<AUSearchBarDelegate> delegate;
  42. /**
  43. 初始化方法
  44. @param style 搜索框样式
  45. @return AUSearchBar实例
  46. */
  47. - (instancetype)initWithStyle:(AUSearchBarStyle)style;
  48. @end

代码示例

  • 添加到导航栏:
    1. AUSearchBar *searchBar = [[AUSearchBar alloc] initWithStyle:AUSearchBarStyleNormal];
    2. searchBar.searchTextField.placeholder = @"搜索栏样式(AUSearchBarStyleNormal)";
    3. searchBar.delegate = self;
    4. searchBar.isSupportHanziMode = YES;
    5. searchBar.shouldShowVoiceButton = YES;
    6. self.navigationItem.titleView = searchBar;
    7. self.navigationItem.leftBarButtonItem = nil; // 需要将左边导航按钮置空
    8. self.navigationItem.rightBarButtonItem = nil; // 需要将右边导航按钮置空
    9. self.navigationItem.hidesBackButton = YES; // 需要隐藏返回按钮
  • 添加到普通视图:
    1. searchBar = [[AUSearchBar alloc] initWithStyle:AUSearchBarStyleDetail];
    2. searchBar.searchTextField.placeholder = @"搜索栏样式(AUSearchBarStyleDetail)";
    3. searchBar.delegate = self;
    4. searchBar.isSupportHanziMode = YES;
    5. searchBar.shouldShowVoiceButton = YES;
    6. [self.view addSubview:searchBar];