很多APP都会涉及到搜索框,苹果也为我们提供了默认的搜索框UISearchBar。但实际项目中我们通常需要更改系统默认搜索框的样式。为了实现这一目标,我们需要先搞懂 UISearchBar 的属性及方法。在系统的掌握了这些基础的前提下才能更好的去应用它,包括修改样式、或者是模仿系统搜索框的样式自定义一个自己的搜索框等。

本文主要介绍内容分为以下三个部分:
1. UISearchBar 的属性

2. UISearchBar 的方法

3. 自定义 UISearchBar 的样式

1. UISearchBar 的属性

介绍之前先说一下 UISearchBar 的初始化方法:UISearchBar 是 UIView 的子类,它的初始化方法有三种:

- (instancetype)init
- (instancetype)initWithFrame:(CGRect)frame
- (nullable instancetype)initWithCoder:(NSCoder *)aDecoder

这三个初始化方法是我们常见的初始化 UIView 以及它的子类的方法,比较常见,而且也不是介绍重点,所以这里不展开说明。

1.1 搜索框风格
  • 属性
// 搜索框风格
@property(nonatomic) UIBarStyle barStyle;

UIBarStyle 有四种枚举值,但后两种已经禁用。

typedef NS_ENUM(NSInteger, UIBarStyle) {
UIBarStyleDefault //白色搜索框,灰色背景
UIBarStyleBlack //黑色搜索框, UIBarStyleBlackOpaque = 1, // 禁用. Use UIBarStyleBlack
UIBarStyleBlackTranslucent = 2, // 禁用. Use UIBarStyleBlack and set the translucent property to YES
}
  • 效果图:
 
UIBarStyleDefault 样式
 
UIBarStyleBlack样式
1.2 搜索的文本、搜索框顶部的提示信息、占位符
  • 属性
 // 搜索的文本
@property(nullable,nonatomic,copy) NSString *text;
// 搜索框顶部的提示信息
@property(nullable,nonatomic,copy) NSString *prompt;
// 占位符,默认nil, 若有值则在输入文本后消失
@property(nullable,nonatomic,copy) NSString *placeholder;
  • 效果图:
 
prompt 和 placeholder
 
输入文本为 text 后 placeholder 消失
1.3 搜索框右侧的按钮
  • 属性
// 搜索框右侧是否显示图书按钮
@property(nonatomic) BOOL showsBookmarkButton;
//搜索框右侧是否显示取消按钮
@property(nonatomic) BOOL showsCancelButton;
//搜索框右侧是否显示搜索结果按钮
@property(nonatomic) BOOL showsSearchResultsButton;
// 搜索结果按钮为选中状态
@property(nonatomic, getter=isSearchResultsButtonSelected) BOOL searchResultsButtonSelected;

以上四个属性的默认值都是 NO

  • 效果图:
 
showsBookmarkButton = YES 效果
 
showsCancelButton = YES 效果
 
showsSearchResultsButton = YES 效果
 
searchResultsButtonSelected = YES 效果,要结合showsSearchResultsButton = YES使用
1.4 风格颜色、背景颜色
  • 属性
// 风格颜色,可用于修改输入框的光标颜色,取消按钮和选择栏被选中时候都会变成设置的颜色
@property(null_resettable, nonatomic,strong) UIColor *tintColor;
// 搜索框背景颜色
@property(nullable, nonatomic,strong) UIColor *barTintColor;
  • 测试代码
    self.tintColor = [UIColor orangeColor];      //设置光标颜色为橘色
self.barTintColor = [UIColor grayColor]; //设置搜索框背景颜色为灰色
  • 效果图:
 
tintColor 和 barTintColor
1.5 搜索框样式
  • 属性
// 搜索框样式
@property (nonatomic) UISearchBarStyle searchBarStyle

它有三种枚举值:

typedef NS_ENUM(NSUInteger, UISearchBarStyle) {
UISearchBarStyleDefault, // 默认样式,和UISearchBarStyleProminent 一样
UISearchBarStyleProminent, // 显示背景,常用在my Mail, Messages and Contacts
UISearchBarStyleMinimal // 不显示背景,系统自带的背景色无效,自定义的有效,常用在Calendar, Notes and Music
}
  • 效果图:

     
    UISearchBarStyleMinimal 不显示背景
     
    UISearchBarStyleDefault 和 UISearchBarStyleProminent 都显示背景
1.6 搜索栏的附件选择按钮视图
  • 属性
// 选择按钮试图的按钮标题
@property(nullable, nonatomic,copy) NSArray<NSString *> *scopeButtonTitles ;
// 选中的按钮下标值 ,默认 0. 如果超出范围则忽略
@property(nonatomic) NSInteger selectedScopeButtonIndex ;
// 是否显示搜索栏的附件选择按钮视图
@property(nonatomic) BOOL showsScopeBar;
  • 测试代码
    self.placeholder = @"搜索";
self.showsScopeBar = YES;
self.scopeButtonTitles = @[@"One", @"Two", @"Three"];
self.selectedScopeButtonIndex = 1;
  • 效果图:
 
带选择按钮视图的搜索栏
1.7 搜索框背景图片、搜索框附属分栏条的背景颜色
  • 属性
// 搜索框背景图片
@property(nullable, nonatomic,strong) UIImage *backgroundImage;
// 搜索框附属分栏条的背景颜色
@property(nullable, nonatomic,strong) UIImage *scopeBarBackgroundImage;
  • 测试代码
    //设置搜索框背景图片
UIImage *backgroundImage = [UIImage imageNamed:@"image001"];
self.backgroundImage = backgroundImage; //搜索框附属分栏条的背景颜色
UIImage *scopeBarBackgroundImage = [UIImage imageNamed:@"image002"];
self.scopeBarBackgroundImage = scopeBarBackgroundImage;
  • 效果图:
 
设置backgroundImage 和 scopeBarBackgroundImage
1.8 索框中文本框的背景偏移量和文本偏移量
  • 属性
// 搜索框中文本框的背景偏移量
@property(nonatomic) UIOffset searchFieldBackgroundPositionAdjustment;
// 搜索框中文本框的文本偏移量
@property(nonatomic) UIOffset searchTextPositionAdjustment;
  • 测试代码
    self.searchFieldBackgroundPositionAdjustment = UIOffsetMake(5, 3);
self.searchTextPositionAdjustment = UIOffsetMake(10, 5);

效果图:

 
设置偏移量前后对比图
PS: UITextInputAssistantItem *inputAssistantItem 、BOOL translucent 、UIView *inputAccessoryView 经过测试这三个属性并不太清楚具体实现效果,之后会继续深入了解一下,记在这里,作为提醒,如果有谁刚好了解它们,希望能够给与帮助,非常感谢。

2. UISearchBar 的方法

2.1 设置是否动画效果的显示或隐藏取消按钮
  • 方法:
// 设置是否动画效果的显示或隐藏取消按钮
- (void)setShowsCancelButton:(BOOL)showsCancelButton animated:(BOOL)animated

通常在开始编辑文本时将调用该方法,让取消按钮显示出来。

  • 测试代码:
-(void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {
NSLog(@"开始输入搜索内容");
[searchBar setShowsCancelButton:YES animated:YES]; // 动画显示取消按钮
}
  • 效果图:
 
setShowsCancelButton: animated:
2.2 设置 (获取) 搜索框背景图片、选择按钮视图的背景图片、文本框的背景图片
  • 方法:
// 1.设置搜索框背景图片
- (void)setBackgroundImage:(nullable UIImage *)backgroundImage forBarPosition:(UIBarPosition)barPosition barMetrics:(UIBarMetrics)barMetrics
// 获取置搜索框背景图片
- (nullable UIImage *)backgroundImageForBarPosition:(UIBarPosition)barPosition barMetrics:(UIBarMetrics)barMetrics // 2.设置选择按钮视图的背景图片
- (void)setScopeBarButtonBackgroundImage:(nullable UIImage *)backgroundImage forState:(UIControlState)state
// 获取选择按钮视图的背景图片
- (nullable UIImage *)scopeBarButtonBackgroundImageForState:(UIControlState)state // 3.设置搜索框文本框的背景图片
- (void)setSearchFieldBackgroundImage:(nullable UIImage *)backgroundImage forState:(UIControlState)state
// 获取搜索框文本框的背景图片
- (nullable UIImage *)searchFieldBackgroundImageForState:(UIControlState)state
  • 测试代码:
    self.showsScopeBar = YES;
self.scopeButtonTitles = @[@"One", @"Two", @"Three"];
self.selectedScopeButtonIndex = 1;
// 设置搜索框背景图片
[self setBackgroundImage:[UIImage imageNamed:@"image001"] forBarPosition:UIBarPositionAny barMetrics:UIBarMetricsDefault];
// 设置选择按钮视图的背景图片
[self setScopeBarButtonBackgroundImage:[UIImage imageNamed:@"image002"] forState:UIControlStateNormal];
// 设置搜索框文本框的背景图片
[self setSearchFieldBackgroundImage:[UIImage imageNamed:@"image003"] forState:UIControlStateNormal];
  • 效果图:
 
设置搜索框背景图片、选择按钮视图的背景图片、文本框的背景图片

我们可以观察一下选择按钮视图的背景图片,发现这个图片只是设置在三个按钮的底部视图,而大的外面的空余背景依旧是灰色,对比1.7中使用属性UIImage *scopeBarBackgroundImage 设置的背景图片,发现使用属性设置背景图片不会有空余的灰色背景,该属性针对的是大的scopeBar, 而不是一个scopeBarButton,这一点需要注意区分。

2.3 设置(获取)搜索框的图标(包括搜索图标、清除输入的文字的图标、图书图标、搜索结果列表图标)
  • 属性
// 设置搜索框的图标
- (void)setImage:(nullable UIImage *)iconImage forSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state;
// 获取搜索框的图标
- (nullable UIImage *)imageForSearchBarIcon:(UISearchBarIcon)icon state:(UIControlState)state;

搜索框图标 UISearchBarIcon 有四个枚举值:

typedef NS_ENUM(NSInteger, UISearchBarIcon) {
UISearchBarIconSearch, // 搜索框放大镜图标
UISearchBarIconClear , // 搜索框右侧可用于清除输入的文字的图标x
UISearchBarIconBookmark , // 搜索框右侧的图书图标
UISearchBarIconResultsList , // 搜索框右侧的搜索结果列表图标
};
  • 测试代码

      self.placeholder = @"搜索";
    self.showsSearchResultsButton = YES;
    // 设置搜索框放大镜图标
    UIImage *searchIcon = [UIImage imageNamed:@"searchIcon"];
    [self setImage:searchIcon forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal]; // 设置搜索结果列表图标
    UIImage *resultListIcon = [UIImage imageNamed:@"arrow"];
    [self setImage:resultListIcon forSearchBarIcon:UISearchBarIconResultsList state:UIControlStateNormal];
  • 效果图
 
重新设置搜索框搜索图标和显示结果列表的图标

可以发现搜索图标和搜索结果列表图标已经改变,至于其他的两个图标仿照上面代码修改即可实现。

2.4 设置(获取)选择按钮视图的分割线图片、按钮上显示的标题样式
  • 方法
// 设置选择按钮视图的分割线图片
- (void)setScopeBarButtonDividerImage:(nullable UIImage *)dividerImage forLeftSegmentState:(UIControlState)leftState rightSegmentState:(UIControlState)rightState;
// 获取选择按钮视图的分割线图片
- (nullable UIImage *)scopeBarButtonDividerImageForLeftSegmentState:(UIControlState)leftState rightSegmentState:(UIControlState)rightState;
// 设置选择按钮视图的标题样式
- (void)setScopeBarButtonTitleTextAttributes:(nullable NSDictionary<NSString *, id> *)attributes forState:(UIControlState)state;
// 获取选择按钮视图的标题样式
- (nullable NSDictionary<NSString *, id> *)scopeBarButtonTitleTextAttributesForState:(UIControlState)state
  • 测试代码
   self.showsScopeBar = YES;
self.scopeButtonTitles = @[@"One", @"Two", @"Three", @"Four"];
// 设置选择按钮视图的分割线图片为一个橘色的线条
[self setScopeBarButtonDividerImage:[UIImage imageNamed:@"divider"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal]; // 设置选择按钮视图的标题样式为20号橘色空心的系统字体
NSDictionary *attributeDic = @{NSFontAttributeName : [UIFont systemFontOfSize:20] , NSStrokeColorAttributeName : [UIColor orangeColor] , NSStrokeWidthAttributeName : @(3)};
[self setScopeBarButtonTitleTextAttributes:attributeDic forState:UIControlStateNormal];
  • 效果图

     
    设置选择按钮视图的分割线图片和按钮上显示的标题样式的效果图
2.5 设置(获取)搜索框四种图标的偏移量
(评论里的小伙伴说不管怎样运行搜索图标总是在左边,测试后发现在iOS11系统上搜索图标默认在左边,而我当时写文章时没有升级模拟器为iOS11,所以非常感谢她的评论,不然自己也没注意到。总之就是如果想要更改搜索图标的位置,可以使用这个方法哦,亲测有效)
  • 方法
//  设置搜索框图标的偏移量
- (void)setPositionAdjustment:(UIOffset)adjustment forSearchBarIcon:(UISearchBarIcon)icon;
// 获取搜索框图标的偏移量
- (UIOffset)positionAdjustmentForSearchBarIcon:(UISearchBarIcon)icon;
  • 测试代码
    self.placeholder = @"搜索";
[self setPositionAdjustment:UIOffsetMake(15, 5) forSearchBarIcon:UISearchBarIconSearch];
  • 效果图
 
设置搜索图标向有偏移15个单位,向下偏移5个单位后的效果图
2.6 UISearchBarDelegate代理方法
  • 方法
// 1. 将要开始编辑文本时会调用该方法,返回 NO 将不会变成第一响应者
- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar;
// 2. 开始输入文本会调用该方法
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar;
// 3. 将要结束编辑文本时会调用该方法,返回 NO 将不会释放第一响应者
- (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar;
// 4. 结束编辑文本时调用该方法
- (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar;
// 5. 文本改变会调用该方法(包含clear文本)
- (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText;
// 6. 文字改变前会调用该方法,返回NO则不能加入新的编辑文字
- (BOOL)searchBar:(UISearchBar *)searchBar shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text ; // 7. 键盘上的搜索按钮点击的会调用该方法
- (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar;
// 8. 搜索框右侧图书按钮点击会调用该方法
- (void)searchBarBookmarkButtonClicked:(UISearchBar *)searchBar ;
// 9.点击取消按钮会调用该方法
- (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar;
// 10.搜索结果列表按钮被按下会调用该方法
- (void)searchBarResultsListButtonClicked:(UISearchBar *)searchBar ;
// 11. 搜索框的附属按钮视图中切换按钮会调用该方法
- (void)searchBar:(UISearchBar *)searchBar selectedScopeButtonIndexDidChange:(NSInteger)selectedScope;
  • 测试代码
- (BOOL)searchBarShouldBeginEditing:(UISearchBar *)searchBar {
return YES;
} - (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {
searchBar.prompt = @"1.开始编辑文本";
[searchBar setShowsCancelButton:YES animated:YES]; // 动画效果显示取消按钮
} - (BOOL)searchBar:(UISearchBar *)searchBar shouldChangeTextInRange:(NSRange)range replacementText:(NSString *)text {
return YES;
} - (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText {
searchBar.prompt = @"2.在改变文本过程中。。。";
} - (void)searchBarSearchButtonClicked:(UISearchBar *)searchBar {
searchBar.prompt = @"3. 点击键盘上的搜索按钮";
} - (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar {
searchBar.prompt = @"4. 点击取消按钮";
searchBar.text = @"";
[self setShowsCancelButton:NO animated:YES];
// 如果希望在点击取消按钮调用结束编辑方法需要让加上这句代码
//[searchBar resignFirstResponder];
} - (BOOL)searchBarShouldEndEditing:(UISearchBar *)searchBar{
return YES;
} - (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar {
searchBar.prompt = @"5.已经结束编辑文本";
}
  • 效果图
    点击取消按钮但没有释放搜索框的第一响应者身份效果图:
 
gif1

点击取消按钮用时释放搜索框的第一响应者身份会调用结束编辑文本的方法:

 
gif2

3. 自定义 UISearchBar 的样式

在自定义UISearchBar 样式之前我们先来看一下UISearchBar的组成:

 
UISearchBar层次结构截图

根据这个截图我们可以概括为下图:

 
简单概括的UISearchBar层次结构

根据这个简单的层次结构图,我们可以更好的了解UISearchBar的组成部分,这样有助于我们更方便的进行自定义样式,下面开始自定义样式!

目标搜索框样式

首先看一下目标样式

 
目标搜索框样式.gif
实现代码

代码中添加约束和自定义颜色可参考之前写的两篇文章:约束自定义颜色

// 委托
- (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar {
[searchBar setShowsCancelButton:YES animated:YES];
} - (void)searchBarCancelButtonClicked:(UISearchBar *)searchBar {
searchBar.text = @"";
[self setShowsCancelButton:NO animated:YES];
[searchBar resignFirstResponder];
} - (void)searchBar:(UISearchBar *)searchBar textDidChange:(NSString *)searchText {
self.voiceButton.hidden = searchText.length > 0 ? YES : NO;
} - (void)searchBarTextDidEndEditing:(UISearchBar *)searchBar {
self.voiceButton.hidden = NO;
} // 样式设计
- (void)modifyStyleByTraversal {
// 修改搜索框背景图片为自定义的灰色
UIColor *backgroundImageColor = [UIColor colorwithHex:0xE3DFDA];
UIImage* clearImg = [self imageWithColor:backgroundImageColor andHeight:45.0];
self.backgroundImage = clearImg;
// 修改搜索框光标颜色
self.tintColor = [UIColor P2Color];
// 修改搜索框的搜索图标
[self setImage:[UIImage imageNamed:@"searchIcon"] forSearchBarIcon:UISearchBarIconSearch state:UIControlStateNormal]; for (UIView *view in self.subviews.lastObject.subviews) {
if([view isKindOfClass:NSClassFromString(@"UISearchBarTextField")]) {
UITextField *textField = (UITextField *)view;
//添加话筒按钮
[self addVoiceButton:textField];
//设置输入框的背景颜色
textField.clipsToBounds = YES;
textField.backgroundColor = [UIColor P1Color]; //设置输入框边框的圆角以及颜色
textField.layer.cornerRadius = 10.0f;
textField.layer.borderColor = [UIColor P2Color].CGColor;
textField.layer.borderWidth = 1; //设置输入字体颜色
textField.textColor = [UIColor P2Color]; //设置默认文字颜色
textField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@" 搜索" attributes:@{NSForegroundColorAttributeName:[UIColor P2Color]}];
} if ([view isKindOfClass:NSClassFromString(@"UINavigationButton")]) {
UIButton *cancel = (UIButton *)view;
[cancel setTitle:@"取消" forState:UIControlStateNormal];
[cancel setTitleColor:[UIColor P2Color] forState:UIControlStateNormal];
}
}
} // 画指定高度和颜色的图片
- (UIImage*) imageWithColor:(UIColor*)color andHeight:(CGFloat)height {
CGRect rect = CGRectMake(0.0, 0.0, 1.0, height);
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext(); CGContextSetFillColorWithColor(context, [color CGColor]);
CGContextFillRect(context, rect); UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext(); return image;
} // 添加话筒按钮
- (void)addVoiceButton:(UIView *)view {
if (!self.voiceButton) {
self.voiceButton = [UIButton buttonWithType:UIButtonTypeCustom];
} [self.voiceButton setImage:[UIImage imageNamed:@"voice"] forState:UIControlStateNormal];
[self.voiceButton addTarget:self action:@selector(say) forControlEvents:UIControlEventTouchUpInside];
[view addSubview:self.voiceButton];
self.voiceButton.translatesAutoresizingMaskIntoConstraints = NO;
[self.voiceButton addWidthConstraint:15];
[self.voiceButton addHeightConstraint:15];
[self.voiceButton addTopConstraintToView:view constant:8];
[self.voiceButton addTrailingConstraintToView:view constant:- 15];
} // 点击话筒触发该方法
- (void)say {
// self.prompt = @"在讲话哦!";
}

补充:修改UISearchBar宽高

UISearchBar 有默认的布局样式,我们想要修改他的宽高,需要重写layoutSubviews 方法。然后在这个方法里面修改UISearchBarTextField的宽高。

实现代码
- (void)layoutSubviews {
[super layoutSubviews];
UITextField *textField = [self valueForKey:@"searchBarTextField"]; if (textField) {
textField.frame = CGRectMake(50, 10, self.bounds.size.width - 100, 35);
}
}
  • 效果图:

     
    自定义搜索框的宽高
关注

作者:遇见0620

iOS开发UI篇 -- UISearchBar 属性、方法详解及应用(自定义搜索框样式)的更多相关文章

  1. iOS开发UI篇—transframe属性(形变)

    iOS开发UI篇—transframe属性(形变) 1. transform属性 在OC中,通过transform属性可以修改对象的平移.缩放比例和旋转角度 常用的创建transform结构体方法分两 ...

  2. iOS开发UI篇—transframe属性(形变)

    iOS开发UI篇—transframe属性(形变) 1. transform属性 在OC中,通过transform属性可以修改对象的平移.缩放比例和旋转角度 常用的创建transform结构体方法分两 ...

  3. iOS开发——实用篇&KVO与KVC详解

    KVO与KVC详解 由于ObjC主要基于Smalltalk进行设计,因此它有很多类似于Ruby.Python的动态特性,例如动态类型.动态加载.动态绑定等.今天我们着重介绍ObjC中的键值编码(KVC ...

  4. ios开发UI篇—UIScrollView属性及其代理方法

    一.UIScrollView是什么? 1.UIScrollView是滚动的view,UIView本身不能滚动,子类UIScrollview拓展了滚动方面的功能. 2.UIScrollView是所有滚动 ...

  5. iOS开发支付篇——内购(IAP)详解

    1 <em>内购所需要的资料整理总结,史上最完整的,哈哈哈哈哈哈</em> 思维导图 重点总结: 1 2 3 4 5 6 7 8 9 10 11 12 13 1.获取内购列表( ...

  6. iOS开发基础篇-transform属性

    一. transform 属性 在OC中,通过 transform 属性可以修改对象的平移.缩放比例和旋转角度. 1)创建“基于控件初始位置”的形变  CGAffineTransformMakeRot ...

  7. IOS开发UI篇—导航控制器属性和基本使用

    IOS开发UI篇—导航控制器属性和基本使用 一.导航控制器的一些属性和基本使用 1.把子控制器添加到导航控制器中的四种方法 (1) 1.创建一个导航控制器 UINavigationController ...

  8. iOS开发UI篇—ios应用数据存储方式(XML属性列表-plist)

    iOS开发UI篇—ios应用数据存储方式(XML属性列表-plist) 一.ios应用常用的数据存储方式 1.plist(XML属性列表归档) 2.偏好设置 3.NSKeydeArchiver归档(存 ...

  9. iOS开发UI篇—CAlayer层的属性

    iOS开发UI篇—CAlayer层的属性 一.position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property ...

随机推荐

  1. springmvc和spring的区别

    springmvc只是spring其中的一部分.spring 可以 支持 hibernate ,ibatis ,JMS,JDBC 支持事务管理, 注解功能,表达式语言,测试springmvc 就是一个 ...

  2. redux-devtools的使用

    1.浏览器里安装redux-devtools 2.在项目的入口文件里  找到 createStore函数调用的地方,给它加第二个参数 window.__REDUX_DEVTOOLS_EXTENSION ...

  3. MongoDB Limit/限制记录

    Limit() 方法 要限制 MongoDB 中的记录,需要使用 limit() 方法. limit() 方法接受一个数字型的参数,这是要显示的文档数. 语法: limit() 方法的基本语法如下 & ...

  4. win7 远程连接服务器出现身份验证错误,且找不到加密Oracle修正

    用远程桌面连接登录服务器,结果,弹出一个错误的提示框:发生身份验证错误,要求的函数不受支持. 然后在网上找了相关的教程,基本上所有的方法都是如下所示: 策略路径:"计算机配置"-& ...

  5. Mybatis学习第二天——mapper的动态代理

    传统的Dao层开发通过接口与实现类的方式,Mybatis中通过mapper动态代理是需要定义接口. 1.传统Dao层封装 那么可以将公共资源提取出来,剩余的封装成方法来实现.下面是UserDaoImp ...

  6. Rxjava学习(一基础篇)

    一.Rxjava跟EventBus的区别 RxJava 是一个响应式编程框架,通过一种扩展的观察者设计模式来实现异步操作. 跟AsyncTask和Handler类似,但是比AsyncTask和Hand ...

  7. Linux修改Oracle用戶

    Linux下SSH登陆后: su - Oracle; sqlplus /nolog; conn system/密码; 或者 connect/as sysdba; alter user 用户名 iden ...

  8. leetcode Ch6-Data Structure

    1. Sliding Window Maximum class Solution { public: vector<int> maxSlidingWindow(vector<int& ...

  9. 使用TFHpple解析html

    使用TFHpple解析html https://github.com/topfunky/hpple 前期准备工作 引入静态库文件 添加库文件的 header search paths(注意,必须选中 ...

  10. CSS边框长度控制

    以前需要边框长度比容器小一些时,我用div嵌套.后来发现伪类在实现这个效果时很方便,只需要一个div就够了,另外调整padding和margin都不会很麻烦. <div class=" ...