11

以下のスクリーンショットのように文字のプレフィックスを追加する組み込みの方法はありUITextFieldますか?

ここに画像の説明を入力

いいえの場合、これを達成するための最善かつ最も簡単な方法は何ですか? 私は、backgroundプロパティがこれを行うことができるかもしれないと考えています。

4

5 に答える 5

16

UILabelの上にグレーを追加するだけでUITextFieldうまくいきます。

001 002

は背景画像のように動作することに注意してくださいUILabel。入力したテキストは一番上に表示されます。

003

アップデート

UITextFieldさらに、次のコードを使用してパディングを追加できます。

UIView *thePadding = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 5, 20)];
theTextField.leftView = thePadding;
theTextField.leftViewMode = UITextFieldViewModeAlways;

この方法では、テキストがプレフィックス文字を覆うことはできません。
Rect を調整して、状況に応じて適切に機能するようにします。

于 2012-07-01T20:56:22.053 に答える
9

アンのコードに続いて、IBのUILabelとコードのUIViewを使用せずに、コードで直接これを行うこともできます。

UILabel *poundLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 5, 20)];
poundLabel.text = @"£";
[self.paymentAmount setLeftView:poundLabel];
[self.paymentAmount setLeftViewMode:UITextFieldViewModeAlways];
于 2012-10-17T11:07:54.513 に答える
2

Ditietのソリューション(Retina 上でサイズ 15 システム フォントを使用) では、テキスト フィールドのテキストがドル記号に 0.5 ポイント近すぎました。を使用して、ドル記号ラベルを約 8.5-sizeWithAttributes:に合わせましたwidthが、テキスト フィールドはテキストxを 8 (左側のビューの幅の下限) に配置しました。

ドル記号 (左図) とテキストの間の相対的な配置を完璧にするための 2 つの解決策を見つけました。

解決策 1: ドル記号を右揃えにする

ドル記号ラベルの幅をドル記号の幅の上限に設定します (またはハード コードします)。次に、ドル記号ラベルのテキストを右揃えにします。

UIFont *font = [UIFont systemFontOfSize:15];
UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(100, 200, 120, 44)];
textField.font = font;
NSString *dollarSignText = @"$";
CGSize size = [dollarSignText sizeWithAttributes:@{NSFontAttributeName: font}];
UILabel *dollarSignLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, ceilf(size.width), 44)];
dollarSignLabel.font = font;
dollarSignLabel.text = dollarSignText;
dollarSignLabel.textAlignment = NSTextAlignmentRight;
textField.leftView = dollarSignLabel;
textField.leftViewMode = UITextFieldViewModeAlways;
[self.view addSubview:textField];

このソリューションは、ドル記号ラベル (左図) とテキストの間の相対的な配置を完璧にしますが、ドル記号ラベルの幅を少し (1 ポイント以下) 増やす可能性があり、テキスト フィールドの幅とすべてのテキストを同じ量だけ右にシフトします。

自動レイアウト (または自動サイズ変更) などにより、テキスト フィールドの高さが変わる場合、このソリューションはお勧めしません。

解決策 2: UITextField をサブクラス化し、その配置をオーバーライドする

このソリューションは、自動レイアウト (または自動サイズ変更) を使用してテキスト フィールドの高さを調整することをサポートします。

// VVMAmountTextField.h

@import UIKit;

@interface VVMAmountTextField : UITextField

@end


// VVMAmountTextField.m

#import "VVMAmountTextField.h"

@implementation VVMAmountTextField

#pragma mark - UIView

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        UIFont *font = [UIFont systemFontOfSize:15];
        self.font = font;
        self.keyboardType = UIKeyboardTypeDecimalPad;
        self.placeholder = @"0.00";

        // Set leftView to dollarSignLabel ($).
        UILabel *dollarSignLabel = [[UILabel alloc] initWithFrame:CGRectZero];
        dollarSignLabel.backgroundColor = [UIColor whiteColor];
        dollarSignLabel.font = font;
        dollarSignLabel.text = @"$";
        self.leftView = dollarSignLabel;
        self.leftViewMode = UITextFieldViewModeAlways;
    }
    return self;
}

#pragma mark - UITextField

// Override positioning to make things pixel perfect.

#define DOLLAR_SIGN_WIDTH() [((UILabel *)self.leftView).text sizeWithAttributes:@{NSFontAttributeName: self.font}].width

- (CGRect)textRectForBounds:(CGRect)bounds
{
    bounds = [super textRectForBounds:bounds];
    bounds.origin.x = DOLLAR_SIGN_WIDTH();
    return bounds;
}

- (CGRect)editingRectForBounds:(CGRect)bounds
{
    bounds = [super editingRectForBounds:bounds];
    bounds.origin.x = DOLLAR_SIGN_WIDTH();
    return bounds;
}

- (CGRect)leftViewRectForBounds:(CGRect)bounds
{
    bounds.size.width = DOLLAR_SIGN_WIDTH();
    return bounds;
}

@end

結論

どちらのソリューションもうまくいくようです。解決策 1 ではシフトが発生する可能性がありますが、コードが少なくてもピクセル パーフェクトに見えます。解決策 2 の後で考えただけです。解決策 2 は洗練されており、自動レイアウト (または自動サイズ変更) を使用してテキスト フィールドの高さを調整することをサポートしています。

于 2013-09-25T03:14:11.103 に答える
0

一人でこれができるとは思わないでくださいUITextField。

私ができる1つの方法は、あなたのUITextFieldボーダレスを作りUILabel、 の左側に（しかし隣接して）保持することUITextFieldです. 最後に、境界線が必要な場合は、これら 2 つの要素 (UITextField と UILabel) を UIView 内に配置し、このビューに境界線を付けます。この設定は、作成した画像とまったく同じに見えるはずです。

これがうまくいくかどうか教えてください。

UPDATE : @Anne ポイントとして実行できますが、テキストが UILabel の上で実行されるリスクがあります。私が提案した方が良いと感じています。

于 2012-07-01T20:55:59.993 に答える
0

アンの答えに追加します。UIImageView にして、そこに必要な画像を使用することもできます。UIImageView を使用すると、背景を白に設定して、テキストがその下に隠れるようにすることができます。

于 2012-07-01T20:59:20.720 に答える