5

我想在带有阴影的 UITextField 中绘制文本。为了做到这一点，我继承了 UITextField，并实现了drawTextInRect:如下方法：

- (void)drawTextInRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();

    // Create shadow color
    float colorValues[] = {0.21875, 0.21875, 0.21875, 1.0};
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGColorRef shadowColor = CGColorCreate(colorSpace, colorValues);
    CGColorSpaceRelease(colorSpace);

    // Create shadow
    CGSize shadowOffset = CGSizeMake(2, 2);
    CGContextSetShadowWithColor(context, shadowOffset, 0, shadowColor);
    CGColorRelease(shadowColor);

    // Render text
    [super drawTextInRect:rect];    
}

这在文本字段未编辑时非常有用，但一旦开始编辑，阴影就会消失。有什么我想念的吗？

4

5 回答 5

1

受@jake_hetfield 回答的启发，我创建了一个UITextField使用内部标签进行绘图的自定义，请查看：

ShadowTextField.h 文件 

#import <UIKit/UIKit.h>

@interface ShadowTextField : UITextField

// properties to change the shadow color & offset
@property (nonatomic, retain) UIColor *textShadowColor;
@property (nonatomic) CGSize textShadowOffset;

- (id)initWithFrame:(CGRect)frame 
               font:(UIFont *)font 
          textColor:(UIColor *)textColor 
        shadowColor:(UIColor *)shadowColor 
       shadowOffset:(CGSize)shadowOffset;

@end

ShadowTextField.m 文件 

#import "ShadowTextField.h"

@interface ShadowTextField ()
@property (nonatomic, retain) UILabel *internalLabel;
@end

@implementation ShadowTextField
@synthesize internalLabel = _internalLabel;
@synthesize textShadowColor = _textShadowColor;
@synthesize textShadowOffset = _textShadowOffset;

- (id)initWithFrame:(CGRect)frame 
               font:(UIFont *)font 
          textColor:(UIColor *)textColor 
        shadowColor:(UIColor *)shadowColor 
       shadowOffset:(CGSize)shadowOffset
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code

        // register to my own text changes notification, so I can update the internal label
        [[NSNotificationCenter defaultCenter] addObserver:self
                                                 selector:@selector(handleUITextFieldTextDidChangeNotification) 
                                                     name:UITextFieldTextDidChangeNotification
                                                   object:nil];

        self.font = font;
        self.textColor = textColor;

        self.textShadowColor = shadowColor;
        self.textShadowOffset = shadowOffset;
    }
    return self;
}

// when the user enter text we update the internal label 
- (void)handleUITextFieldTextDidChangeNotification
{
    self.internalLabel.text = self.text;

    [self.internalLabel sizeToFit];
}

// init the internal label when first needed
- (UILabel *)internalLabel
{
    if (!_internalLabel) {
        _internalLabel = [[UILabel alloc] initWithFrame:self.bounds];
        [self addSubview:_internalLabel];

        _internalLabel.font = self.font;
        _internalLabel.backgroundColor = [UIColor clearColor];
    }
    return _internalLabel;
}

// override this method to update the internal label color
// and to set the original label to clear so we wont get two labels
- (void)setTextColor:(UIColor *)textColor
{
    [super setTextColor:[UIColor clearColor]];

    self.internalLabel.textColor = textColor;
}

// override this method to update the internal label text
- (void)setText:(NSString *)text
{
    [super setText:text];

    self.internalLabel.text = self.text;

    [self.internalLabel sizeToFit];
}

- (void)setTextShadowColor:(UIColor *)textShadowColor
{
    self.internalLabel.shadowColor = textShadowColor;
}

- (void)setTextShadowOffset:(CGSize)textShadowOffset
{
    self.internalLabel.shadowOffset = textShadowOffset;
}

- (void)drawTextInRect:(CGRect)rect {
    // don't draw anything
    // we have the internal label for that...
}

- (void)dealloc {
    [_internalLabel release];
    [_textShadowColor release];

    [super dealloc];
}

@end

这是您在视图控制器中使用它的方式 

- (void)viewDidLoad
{
    [super viewDidLoad];

    ShadowTextField *textField = [[ShadowTextField alloc] initWithFrame:CGRectMake(0, 0, 320, 30) 
                                                                   font:[UIFont systemFontOfSize:22.0] 
                                                              textColor:[UIColor whiteColor] 
                                                            shadowColor:[UIColor redColor] 
                                                           shadowOffset:CGSizeMake(0, 1) ] ;
    textField.text = @"This is some text";    
    textField.backgroundColor = [UIColor blackColor];
    [self.view addSubview:textField];
}
于 2012-08-10T10:31:41.790 回答
1

这是以下组件的代码

在此处输入图像描述

@interface AZTextField ()
- (void)privateInitialization;
@end

@implementation AZTextField

static CGFloat const kAZTextFieldCornerRadius = 3.0;

- (id)initWithFrame:(CGRect)frame
{

    self = [super initWithFrame:frame];
    if (!self) return nil;
    [self privateInitialization];
    return self;
}

// In case you decided to use it in a nib
- (id)initWithCoder:(NSCoder *)aDecoder
{
    self = [super initWithCoder:aDecoder];
    if (!self) return nil;
    [self privateInitialization];
    return self;
}

- (void)privateInitialization
{
    self.borderStyle = UITextBorderStyleNone;

    self.layer.masksToBounds = NO;
    self.layer.shadowColor = [UIColor blackColor].CGColor;
    self.layer.shadowOffset = CGSizeMake(0.0f, 5.0f);
    self.layer.shadowOpacity = 0.5f;

    self.layer.backgroundColor = [UIColor whiteColor].CGColor;
    self.layer.cornerRadius = 4;

    // This code is better to be called whenever size of the textfield changed,
    // so if you plan to do that you can add an observer for bounds property
    UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRoundedRect:self.bounds cornerRadius:kAZTextFieldCornerRadius];
    self.layer.shadowPath = shadowPath.CGPath;
}

@end

需要考虑的几件事：

  • 您想将borderStyle设置为none，否则您最终会使用UIKit将子视图放入您的文本字段
  • 根据 Xcode 版本，您可能希望链接 QuartzCore 并#import <QuartzCore/QuartzCore.h>
  • 对于更复杂的外观，您仍然可以使用图层的阴影属性并将绘图代码本身移动到drawRect:方法中，但是如果您覆盖 drawRect 您不想调用 super，jake_hetfield 是正确的，尤其是在方法的末尾
  • 至于文本绘制（你可以看到它贴在组件边框附近），你有一个单独的 drawTextInRect:anddrawPlaceholderInRect:方法分别绘制文本和占位符
  • 您可以使用 UIColor 方法获取颜色并调用 CGColor 属性，它使代码更具可读性和更易于维护

希望有帮助！

于 2012-08-05T12:52:56.940 回答
0

停止调用 super 并自己渲染文本。

于 2012-08-09T10:39:21.023 回答
0

您可以尝试自己绘制标签。消除

[super drawTextInRect:rect]

而是绘制自己的标签。我还没有尝试过，但它可能看起来像这样：

// Declare a label as a member in your class in the .h file and a property for it:
UILabel *textFieldLabel;
@property (nonatomic, retain) UILabel *textFieldLabel;

// Draw the label
- (void)drawTextInRect:(CGRect)rect {
    if (self.textFieldLabel == nil) {
        self.textFieldLabel = [[[UILabel alloc] initWithFrame:rect] autorelease];
        [self.view addSubview:myLabel];
    }

    self.textFieldLabel.frame = rect;
    self.textFieldLabel.text = self.text;

    /** Set the style you wish for your label here **/
    self.textFieldLabel.shadowColor = [UIColor grayColor];
    self.textFieldLabel.shadowOffset = CGSizeMake(2,2);
    self.textFieldLabel.textColor = [UIColor blueColor];

    // Do not call [super drawTextInRect:myLabel] method if drawing your own text
}
于 2012-08-03T15:02:42.473 回答
0

您是否尝试过 CALayer 的标准阴影属性？它通常就足够了，而且要简单得多。用常规的 UITextField 尝试这样的事情：

self.inputContainer.layer.shadowColor=[UIColor blackColor].CGColor;
self.inputContainer.layer.shadowRadius=8.0f;
self.inputContainer.layer.cornerRadius=8.0f;
self.inputContainer.layer.shadowOffset=CGSizeMake(0, 4);

你当然需要先导入 QuartzCore！

#import <QuartzCore/QuartzCore.h>
于 2012-08-10T14:28:11.937 回答