iPhoneGeek 爱疯极客 » 用户界面

iOS 5设备下UINavigationbar的背景修改

bagusflyer — Thu, 08 Dec 2011 01:17:26 +0000

最近我突然发现UINavigationbar背景修改的方法不起作用了，代码如下：

1
2
3
4
5
6
7
8
9

@implementation UINavigationBar (CustomImage)

-(void)drawRect:(CGRect)rect
{
UIImage *image = [UIImage imageNamed:@"navigationbar.png"];
[image drawInRect:CGRectMake(0,0,self.frame.size.width,self.frame.size.height)];
}

@end

发现原来是iOS 5的原因，如果运行在iOS 5以下的版本就没有问题了。经过实验以下方法适合iOS 5（放在ViewDidLoad中）：

1
2
3

if ([self.navigationController.navigationBar respondsToSelector:@selector( setBackgroundImage:forBarMetrics:)]){
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"navigationbar.png"] forBarMetrics:UIBarMetricsDefault];
}

第一条if语句的作用是防止程序在iOS 5以下的版本中崩溃。

这样，依靠这两段代码，我的UINavigationbar的背景问题在iOS 5及以下版本中得到了完美的解决。

创建iOS 5 News Stand应用程序之一 – 外观

bagusflyer — Fri, 21 Oct 2011 02:52:06 +0000

iOS 5提供了一个新的framework – Newsstand framework，它允许把应用程序运行于News Stand中。实际上，News Stand相当于一个特制的文件夹专门放置报纸，杂志类应用程序。由于时间有限，这里我分几个部分介绍这一技术。

首先介绍的就是怎样把一个应用程序改变成一个News Stand程序，这实际上有两步工作，一是让程序运行于News Stand，二是改变程序的图标。

1. 让程序运行于News Stand内

可以在Info.plist中添加

1
2
>UINewsstandApp>
/>

或者直接在Xcode中更改Info.plist（如图）：

就这么简单，运行！你的程序就运行在News Stand中了。

不过，出现在News Stand中的是一个非常丑陋的白色方框。这一定不是你需要的效果。那么，我们需要第二步。

2. 为你的News Stand程序添加图标

应用程序仍需定义标准图标，这些图标用于settings，search，Push等，（而且你的程序有可能运行于iOS 5以前的版本）。Newsstand 图标可以反应应用的内容，可以动态更新，另外还可以加一些修饰，使其看上去就像真正的杂志或者报纸。

你可以直接修改Info.plist

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
>CFBundleIcons>
>
>CFBundlePrimaryIcon>
>
>CFBundleIconFiles>
>
>Icon.png>
>Icon@2x.png>
>
>
>UINewsstandIcon>
>
>CFBundleIconFiles>
>
>NewsstandIcon1.png>
>NewsstandIcon1@2x.png>
>
>
>

或者直接使用Xcode编辑：

关于BindingType和BindingEdge应该很容易理解，我就不知赘述了。另外Newsstand中的图标不一定是正方形，只是不知有没有尺寸上的限制。

强迫UIView以某种方向显示的秘诀

bagusflyer — Thu, 25 Aug 2011 06:29:53 +0000

我有一个项目其中某些UIView必须以特定的方向（Portrait或者Landscape）显示。这个看似简单的问题，困惑了我很久，直到今天我才完全找到解决的方法。

为简单起见，我以一个简单的例子说明一下我的问题。我有一个允许各种方向知道旋转的RootViewController，它包括一个共三行的UITableView，第一行显示“Portrait”，第二行显示“Landscape”，第三行显示“Autorotation”，点击某些行后，使用pushViewController打开一个DetailViewController，这个View Controller控制的view将根据行的内容有所不同。比如，如果按下的是第一行，则在DetailViewController中显示“Portrait”，并只允许UIView以portrait方式显示。

首先，我根据按下的行号，以orientation作为参数，传递给DetailViewController，在此ViewController的shouldAutorotateToInterfaceOrientation方法中根据orentation参数返回。代码如下：

1
2
3
4
5
6
7
8
9
10
11

- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation
{
if ( self.orientation == 0 ) // allow portrait
return (interfaceOrientation == UIInterfaceOrientationPortrait) || (interfaceOrientation == UIInterfaceOrientationPortraitUpsideDown);
else if ( self.orientation == 1 ) // allow landscape
{
return (interfaceOrientation == UIInterfaceOrientationLandscapeLeft) || (interfaceOrientation == UIInterfaceOrientationLandscapeRight);
}
else // allow autorotation
return YES;
}

以上代码仅仅使得DetailViewController在特定情况下确定是否允许进行自动旋转。但如果初始的方向不正确的话，它却无能为力。比如，我在RootViewController（它允许任何方向的旋转）处于Landscape方向时，点击第一行（row 0），此时的DetailViewController所呈现的UIView仍然处于Landscape，当然这与我程序的本意当然不符。

于是我的问题就变成了怎样强迫UIView旋转到特定方向？我在网上搜索到一种方案，即UIDvice的setOrientation: 方法，不过遗憾的是此方法是私有api，当然我不能接受。于是我又试验了UIApplication中setStatusBarOrientation:方法，该方法果然把状态条旋转到了我需要的方向，不过我的UIView还是处于不正确的方向（以我上一段提到的情况为例）。因为在创建DetailViewController时触发的shouldAutorotateToInterfaceOrientation中（发生在setStatusBarOrientation之前），当时的UIInterfaceOrientation还是为landscape，而我的orientation参数为0，所以返回为NO，因此屏幕并没有旋转。有什么方法能够再触发一次shouldAutorotateToInterfaceOrientation吗？

答案是肯定的，见我的代码：

1
2
3
4
5

// trick to retrigger shouldAutorotateToInterfaceOrientation method
UIWindow *window = [[UIApplication sharedApplication] keyWindow];
UIView *view = [window.subviews objectAtIndex:0];
[view removeFromSuperview];
[window addSubview:view];

在setStatusBarOrientation后，调用以上代码，强行触发了shouldAutorotateToInterfaceOrientation了，此时orientation为0，但interfaceOrientation我已经通过setStatusBarOrientation设置成了UIInterfaceOrientationPortrait，所以会返回YES，直接导致UIView的旋转。（以上代码是我在网上看到的方法）。

至此，整个解决方案就比较完满了，代码下载。不过请注意我的代码实例仅仅针对一种情况进行了处理（即orientation等于1，即仅仅允许UIView处于landscape时），其他情况依此类推。

presentModalViewController显示半透明UIView

bagusflyer — Tue, 05 Jul 2011 05:32:32 +0000

很多时候我们需要使用presentModalViewController来显示Modal View。如果需要显示半透明的Modal View应该怎么办呢？当然可以自己创建一个半透明的UIView，然后模拟presentModalViewController的动画效果。

不过iOS 4以后的版本再也不需要怎么麻烦了，有一个非常简单的方法，示例如下（这段代码运行于一个View Controller中)：

1
2
3
4
5
6

UIViewController* transparentView = [[UIViewController alloc] init];

UIViewController* controller = self.view.window.rootViewController;
transparentView.view.backgroundColor = [UIColor clearColor];
controller.modalPresentationStyle = UIModalPresentationCurrentContext;
[controller presentModalViewController:transparentView animated:YES];

其要点就是使用iOS特有的rootViewController来显示Modal View。

分享一小段代码

bagusflyer — Fri, 13 May 2011 06:13:58 +0000

我们经常会遇到这种情况，某个按钮太小很难按到，又不想把按钮图片做得太大。我把它作成了一个Class Method，放在了我的Utils类中。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

+(void)resizeTouchableAreaForButton:(UIButton* )button withNewSize:(CGSize)size
{
// increase margin around button based on width
const CGFloat margin_h = 0.5f * ( size.width - button.frame.size.width );
const CGFloat margin_v = 0.5f * ( size.height - button.frame.size.height );

// add margin on all four sides of the button
CGRect newFrame = button.frame;
newFrame.origin.x -= margin_h;
newFrame.origin.y -= margin_v;
newFrame.size.width += 2.0f * margin_h;
newFrame.size.height += 2.0f * margin_v;

button.frame = newFrame;
}

这段代码把按钮的可按区域扩大到新的尺寸。不过有一个前提是使用UIButton的setImage而不是setBackgroundImage来设置按钮图片。

检查UIWebView上touch的最简单的方法

bagusflyer — Thu, 10 Mar 2011 02:09:29 +0000

我有一个程序需要检测UIWebView是否有touch动作，不幸得很，UIWebView上的touchesBegan等事件无法被检测。在网上查了一下，有许多解决方法，比如在UIWebView上再加一个透明的UIView，重置UIWindow的sendEvent或重置UIWebView的hitest方法等等，要么就是方案不太完美，要么就是太过复杂，经过实验我使用的这种方法最为简单（否则我也没有时间写在这里了），当然我只要求检测UIWebView上有touch动作即可。我的方法是使用UITapGestureRecognizer。关键的地方有两点，请看我的代码（我的代码是在一个UIViewController中):

1
2
3
4
5

UITapGestureRecognizer* singleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(handleSingleTap:)];
[self.view addGestureRecognizer:singleTap];
singleTap.delegate = self;
singleTap.cancelsTouchesInView = NO;
[singleTap release];

第三行是第一个关键的地方，就是必须设置UITapGuestureRecognizer的delegate（一般我们直接使用initＷithＴarget，无需设置其delegate）。

第二个关键的地方是在下列delegate方法return YES。

1
2
3
4

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
return YES;
}

做到这两点，你的UIWebView就可以响应touch事件了，你可以使用不同的UIGestureRecognizer来满足你不同的要求等。(handleSingleTap方法请自行补上）。

怎样使UISearchBar背景透明

bagusflyer — Tue, 14 Sep 2010 10:51:09 +0000

在使用UISearchBar时，将背景色设定为clearColor，或者将translucent设为YES，都不能使背景透明，经过一番研究，发现了一种超级简单和实用的方法：

1	[[searchbar.subviews objectAtIndex:0]removeFromSuperview];

背景完全消除了，只剩下搜索框本身了。

访问外部网页

bagusflyer — Tue, 10 Aug 2010 01:42:55 +0000

实际上有两种方法，第一种是：

1	[[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"http://www.google.com"]];

这种方法将会退出当前程序，用Safari打开url。我有好几个朋友都问到这个问题，实际上非常简单，可以使用UIWebView在当前程序中打开网页（假定你的UIWebView实例为webView）：

1
2
3
4
5
6
7
8
9
10

NSString *urlAddress = @"http://localhost";

//Create a URL object.
NSURL *url = [NSURL URLWithString:urlAddress];

//URL Requst Object
NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];

//Load the request in the UIWebView.
[webView loadRequest:requestObj];

以密码方式显示UITextField文本

bagusflyer — Sun, 25 Jul 2010 13:44:14 +0000

很简单，如下：

1	textField.secureTextEntry = YES;

不规则形状的UIButton

bagusflyer — Tue, 04 May 2010 02:48:54 +0000

有的时候，我们需要使用非规则形状的按钮。UIButton允许你选择带有alpha通道的图像。比如，我使用下面四个图像：

然后用Interface Builder创建用户定义按钮，你可以透过图像的透明部分看到后面的按钮（假定按钮未定义为opaque）。.然而 UIButton 的点击测试（hit-testing)并未考虑图像的透明性，所以当你将图像重叠放置时，如图所示：

如果你点击此处：

默认的点击测试的结果是绿色菱形按钮被按下，而不是蓝色按钮。当然这可能就是你需要的效果，但大部分情况下并非如你所愿。那么怎样才能让你的程序正常工作？实际上很简单，你只需要一个UIButton的子类并重写点击测试方法。

然而，首先你需要一个方法能确定图像上指定点是透明的。遗憾的是UIImage无法像Cocoa为NSImage提供的NSBitmapRepresentation 那样方便地访问位图数据。但是每个UIImage都具有一个称为CGImage的属性可以访问内部图像数据，Apple发布了一篇技术文章介绍了怎样通过CGImageRef访问内部位图数据。

根据这篇文章的介绍，我们很容易就写出一个方法，它以CGPoint为参数，根据该点是否透明（0）与否返回YES或NO。

UIImage-Alpha.h

1
2
3
4
5
6
7
8

#import

@interface UIImage(Alpha)

- (NSData *)ARGBData;
- (BOOL)isPointTransparent:(CGPoint)point;

@end

UIImage-Alpha.m

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83

CGContextRef CreateARGBBitmapContext (CGImageRef inImage)
{
CGContextRef context = NULL;
CGColorSpaceRef colorSpace;
  void * bitmapData;
  int bitmapByteCount;
  int bitmapBytesPerRow;

size_t pixelsWide = CGImageGetWidth(inImage);
size_t pixelsHigh = CGImageGetHeight(inImage);
bitmapBytesPerRow = (pixelsWide * 4);
  bitmapByteCount = (bitmapBytesPerRow * pixelsHigh);

colorSpace = CGColorSpaceCreateDeviceRGB();
  if (colorSpace == NULL)
return nil;

bitmapData = malloc( bitmapByteCount );
  if (bitmapData == NULL)
  {
CGColorSpaceRelease( colorSpace );
return nil;
}

  context = CGBitmapContextCreate (bitmapData,
pixelsWide,
pixelsHigh,
8,
bitmapBytesPerRow,
colorSpace,
kCGImageAlphaPremultipliedFirst);

  if (context == NULL)
{
free (bitmapData);
fprintf (stderr, "Context not created!");
  }

  CGColorSpaceRelease( colorSpace );

return context;
}

@implementation UIImage(Alpha)

- (NSData *)ARGBData
{
  CGContextRef cgctx = CreateARGBBitmapContext(self.CGImage);
  if (cgctx == NULL)
return nil;

size_t w = CGImageGetWidth(self.CGImage);
size_t h = CGImageGetHeight(self.CGImage);
CGRect rect = {{0,0},{w,h}};
  CGContextDrawImage(cgctx, rect, self.CGImage);

void *data = CGBitmapContextGetData (cgctx);
  CGContextRelease(cgctx);

if (!data)
return nil;

size_t dataSize = 4 * w * h; // ARGB = 4 8-bit components
return [NSData dataWithBytes:data length:dataSize];
}

- (BOOL)isPointTransparent:(CGPoint)point
{
  NSData *rawData = [self ARGBData]; // See about caching this
if (rawData == nil)
return NO;

size_t bpp = 4;
  size_t bpr = self.size.width * 4;

NSUInteger index = point.x * bpp + (point.y * bpr);
  char *rawDataBytes = (char *)[rawData bytes];

return rawDataBytes[index] == 0;

}

@end

一旦我们有能力确定图像中的某点是否透明，我们就可以编写UIButton的子类，重写hitTest:withEvent: 方法。它将返回一个UIView的实例。如果该点在此视图或其子视图中未被点击，那么将返回nil。如果点击在其子视图，那么将返回点击中的子视图，如果点击中视图，那么返回视图本身。

然而，我们可以进行一些简化，这是因为尽管UIButton继承了UIView，技术上可能具有子视图，但这非常的少见，而且Interface Builder并不支持这样做。所以在本文的实现中并不考虑子视图。

IrregularShapedButton.h

1
2
3
4
5
6
7

#import

@interface IrregularShapedButton : UIButton {

}

@end

IrregularShapedButton.m

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

#import "IrregularShapedButton.h"
#import "UIImage-Alpha.h"

@implementation IrregularShapedButton

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
if (!CGRectContainsPoint([self bounds], point))
  return nil;
else
{
UIImage *displayedImage = [self imageForState:[self state]];
  if (displayedImage == nil) // No image found, try for background image
displayedImage = [self backgroundImageForState:[self state]];
if (displayedImage == nil) // No image could be found, fall back to
return self;

BOOL isTransparent = [displayedImage isPointTransparent:point];
  if (isTransparent)
  return nil;

}

return self;
}

@end

将Interface Builder中的四个图像按钮改为IrregularShapedButton，它们将正常工作了。