web-dev-qa-db-ja.com

異なるデバイスの単一サイズクラス内のiOSの異なるフォントサイズ

IOS 8では、サイズクラスごとに異なるUIレイアウトを設計できます。私が直面している問題は、コンパクト幅とレギュラー高さ(縦向きのすべてのiPhoneのサイズクラス)のレイアウトを設計しましたが、3.5および4インチデバイス(iPhone 4および5)のラベルのフォントサイズを小さくしたいです。 )、4.7インチ(iPhone 6)では比較的大きく、5.5インチ(iPhone 6 Plus)デバイスではさらに大きくなります。私は検索しましたが、同じサイズのクラス内の異なるデバイスに異なるフォントサイズを設定するためのソリューションを見つけることができませんでした。

17
Maverick

編集:これはもうお勧めしません。このアプローチは、新しいデバイスが出てくるとうまく拡張できません。動的フォントサイズとサイズクラス固有のフォントを組み合わせて使用​​します。


新しいiPhoneモデルが登場したとしましょう。自動レイアウトとサイズクラスを使用している場合、アプリをこの新しいデバイスと互換性を持たせるためにすべての制約を手動で修正する必要はありません。ただし、次のコードを使用してUILabelのフォントサイズを設定できます。

if UIScreen.mainScreen().bounds.size.height == 480 {
    // iPhone 4
    label.font = label.font.fontWithSize(20)     
} else if UIScreen.mainScreen().bounds.size.height == 568 {
    // IPhone 5
    label.font = label.font.fontWithSize(20)
} else if UIScreen.mainScreen().bounds.size.width == 375 {
    // iPhone 6
    label.font = label.font.fontWithSize(20)
} else if UIScreen.mainScreen().bounds.size.width == 414 {
    // iPhone 6+
    label.font = label.font.fontWithSize(20)
} else if UIScreen.mainScreen().bounds.size.width == 768 {
    // iPad
    label.font = label.font.fontWithSize(20)
}
24
Cesare

私はSwift 3 +のプロジェクトでそれを処理していますUILabelカスタムクラスUILabel extension、およびUIDevice extensionが一般的なソリューションです。

screenTypeを取得するためのUIDevice拡張機能

public extension UIDevice {

    var iPhone: Bool {
        return UIDevice().userInterfaceIdiom == .phone
    }

    enum ScreenType: String {
        case iPhone4
        case iPhone5
        case iPhone6
        case iPhone6Plus
        case iPhoneX
        case Unknown
    }

    var screenType: ScreenType {
        guard iPhone else { return .Unknown}
        switch UIScreen.main.nativeBounds.height {
        case 960:
            return .iPhone4
        case 1136:
            return .iPhone5
        case 1334:
            return .iPhone6
        case 2208:
            return .iPhone6Plus
        case 2436:
            return .iPhoneX
        default:
            return .Unknown
        }
    }

}

以下は、フォントサイズを調整するためにscreenTypeを使用するUILabel拡張機能です。 adjustsFontSizeToFitDeviceメソッドもUILabelカスタムクラスに追加できますが、に追加しましたすべてのタイプのUILabelインスタンスからアクセスできるようにするUILabel拡張機能

adjustsFontSizeToFitDeviceメソッドで使用される定数「2」は、任意の数に変更できます。私のロジックは、iPhone 6/7/8をデフォルトの解像度と見なし、その解像度の各ラベルに適切なフォントサイズ(Storyboardで)を与えることです。次に、iPhone XおよびiPhone 6/7/8 Plusの場合は2ポイントを加算し、iPhone 4/5の場合は2ポイントを減算します。

extension UILabel {

    func adjustsFontSizeToFitDevice() {

        switch UIDevice().screenType {
        case .iPhone4, .iPhone5:
            font = font.withSize(font.pointSize - 2)
            break
        case .iPhone6Plus, .iPhoneX:
            font = font.withSize(font.pointSize + 2)
            break
        default:
            font = font.withSize(font.pointSize)
        }
    }

}

最後に、UILabelカスタムクラスを使用して、MyCustomLabelからサブクラス化されたすべてのラベルにフォント調整を適用します。

class MyCustomLabel: UILabel {

    // MARK: - Life Cycle Methods

    override func awakeFromNib() {
        super.awakeFromNib()

        adjustsFontSizeToFitDevice()
    }

}

使用:Storyboardで、フォントサイズが必要なMyCustomLabelからUILabelのすべてのインスタンスをサブクラス化します。デバイスのサイズに応じて調整します。

13
Maverick

以下のように希望の効果を得ることができます。

_Usage :_フォントサイズとして14を使用する代わりに_14.fontSize_を使用できます、デバイスごとに変更されます。デルタ値によって異なります。

コードのどこにでも条件を追加する必要はありません。以下のように一度だけ。

使用法:UIFont.font_medium(12.fontSize)

IFont拡張:

_extension UIFont {    
    class func font_medium(_ size : CGFloat) -> UIFont {
        return UIFont(name: "EncodeSans-Medium", size: size)!;
    }    
}
_

IDevice Extension:

_extension UIDevice {
    enum DeviceTypes {
        case iPhone4_4s
        case iPhone5_5s
        case iPhone6_6s
        case iPhone6p_6ps
        case after_iPhone6p_6ps
    }

    static var deviceType : DeviceTypes {
        switch UIScreen.main.height {
        case 480.0:
            return .iPhone4_4s
        case 568.0:
            return .iPhone5_5s
        case 667.0:
            return .iPhone6_6s
        case 736.0:
            return .iPhone6p_6ps
        default:
            return .after_iPhone6p_6ps
        }
    }
}
_

Int Extension:

_extension Int{

    var fontSize : CGFloat {

        var deltaSize : CGFloat = 0;
        switch (UIDevice.deviceType) {
        case .iPhone4_4s,
             .iPhone5_5s :
            deltaSize = -1;
        case .iPhone6_6s :
            deltaSize = 2;
        case .iPhone6p_6ps :
            deltaSize = 2;
        default:
            deltaSize = 0;
        }

        let selfValue = self;
        return CGFloat(selfValue) + deltaSize;
    }
}
_
4

二つの方法:

1)アプリのデリゲートでメソッドを手動で作成し、そのオブジェクトを共有してメソッドを呼び出します。

例:

    var device = UIDevice.currentDevice().model

    if (device == "iPhone" || device == "iPhone Simulator" || device == "iPod touch")
        {
            labelboarder.frame = CGRectMake(0,self.usernameTF.frame.height-10, self.usernameTF.frame.width, 1)
            labelboarder1.frame = CGRectMake(0,self.usernameTF.frame.height-10, self.usernameTF.frame.width,1)
        }
    else
        {
            labelboarder.frame = CGRectMake(0,self.usernameTF.frame.height, 500, 1)
            labelboarder1.frame = CGRectMake(0,self.usernameTF.frame.height, 500,1)
        }

2)すべてのUIアイテムで、属性インスペクターに移動し、フォントを宣言します。

(フォントサイズフィールドの左側に+記号が表示されています。それをクリックして、一致するサイズクラスを選択し、フォントサイズを宣言します。)

2番目のオプションは私にとって便利です。ハッピーコーディング!

3
A.G

ラベルごとにコードを記述する代わりに、以下のようにラベルクラスをカスタムラベルクラスで拡張を実行すると、デバイスの解像度のスケーリング係数に基づいて自動的にスケーリングされます。

#define  SCALE_FACTOR_H ( [UIScreen mainScreen].bounds.size.height / 568 )


CustomLabel.h

#import <UIKit/UIKit.h>

@interface CustomLabel : UILabel

@end


CustomLabel.m
#import "CustomLabel.h"

@implementation CustomLabel

/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/
- (id)initWithCoder:(NSCoder *)aDecoder {
    if( (self = [super initWithCoder:aDecoder]) ){
        [self layoutIfNeeded];
        [self configurefont];
    }
    return self;
}

- (void) configurefont {
    CGFloat newFontSize = (self.font.pointSize * SCALE_FACTOR_H);
    self.font = [UIFont fontWithName:self.font.fontName size:newFontSize];
}
@end
1

このように作成し、

#define VIEWHEIGHT       ([[UIScreen mainScreen] bounds].size.height)
#define VIEWWIDTH        ([[UIScreen mainScreen] bounds].size.width)
#define FONTNAME_LIGHT   @"AppleSDGothicNeo-Regular"
#define FONTNAME_BOLD    @"AppleSDGothicNeo-Bold"
#define LFONT_16         [UIFont fontWithName:FONTNAME_LIGHT size:16]

その後、ラベルのフォントを変更したい場所で、簡単なSwitchケースを作成できます

switch ((VIEWHEIGHT == 568)?1:((VIEWHEIGHT == 667)?2:3)) {
    case 1:{
        boldFont = BFONT_16;
    }
        break;
    case 2:{
        privacyFont = LFONT_18;
        boldFont = BFONT_18;
    }
        break;
    default:{
        privacyFont = LFONT_20;
        boldFont = BFONT_20;
    }
        break;
}

Swift Version

func isPhoneDevice() -> Bool {
    return UIDevice.current.userInterfaceIdiom == .phone
}

func isDeviceiPad() -> Bool {
    return UIDevice.current.userInterfaceIdiom == .pad
}

func isPadProDevice() -> Bool {
    let SCREEN_WIDTH = Float(UIScreen.main.bounds.size.width)
    let SCREEN_HEIGHT = Float(UIScreen.main.bounds.size.height)
    let SCREEN_MAX_LENGTH: Float = fmax(SCREEN_WIDTH, SCREEN_HEIGHT)

    return UIDevice.current.userInterfaceIdiom == .pad && SCREEN_MAX_LENGTH == 1366.0
}

func isPhoneXandXSDevice() -> Bool {
    let SCREEN_WIDTH = CGFloat(UIScreen.main.bounds.size.width)
    let SCREEN_HEIGHT = CGFloat(UIScreen.main.bounds.size.height)
    let SCREEN_MAX_LENGTH: CGFloat = fmax(SCREEN_WIDTH, SCREEN_HEIGHT)

    return UIDevice.current.userInterfaceIdiom == .phone && SCREEN_MAX_LENGTH == 812.0
}

func isPhoneXSMaxandXRDevice() -> Bool {
    let SCREEN_WIDTH = CGFloat(UIScreen.main.bounds.size.width)
    let SCREEN_HEIGHT = CGFloat(UIScreen.main.bounds.size.height)
    let SCREEN_MAX_LENGTH: CGFloat = fmax(SCREEN_WIDTH, SCREEN_HEIGHT)

    return UIDevice.current.userInterfaceIdiom == .phone && SCREEN_MAX_LENGTH == 896.0
}
0
User558

それが私のやり方です。それはSwift 4 :)で書かれています

_enum DeviceSize {
    case big, medium, small
}

protocol Fontadjustable {

    var devicetype: DeviceSize { get }

    func adjustFontSizeForDevice()
}

extension UILabel: Fontadjustable {

    var devicetype: DeviceSize {
        switch UIScreen.main.nativeBounds.height {
        case 1136:
            return .small
        case 1334:
            return .medium
        case 2208:
            return .big
        case 2436:
            return .big
        default:
            return .big
        }
    }

    func adjustFontSizeForDevice() {
        switch self.devicetype {
        case .small:
            self.font = font.withSize(font.pointSize)
        case .medium:
            self.font = font.withSize(font.pointSize + 5)
        case .big:
            self.font = font.withSize(font.pointSize + 10)
        }
    }
}
_

使用法:myawesomeLabel.adjustFontSizeForDevice()

0
BilalReffas