• iOS设计中不同屏幕适配的方法-登陆界面


    在iOS的手机界面设计中,由于不同手机类型的手机的尺寸不同,那么在设计手机界面时就得对屏幕进行适配,这里就以登陆界面的设计为例简单说明下 实现屏幕适配的方法:(屏幕自动适配缩放)

    效果:

     

    下面就看下代码实现的过程:

    1、在代理中实现的代码:

    AppDelegate.h
    //  登陆界面设计
    
    #import <UIKit/UIKit.h>
    
    #define  ScreenHeight [[UIScreen mainScreen]bounds].size.height//屏幕高度
    #define  ScreenWidth  [[UIScreen mainScreen]bounds].size.width//屏幕宽度
    @interface AppDelegate : UIResponder <UIApplicationDelegate>
    
    @property (strong, nonatomic) UIWindow *window;
    @property(assign,nonatomic)float autoSizeScaleX;//缩放X
    @property(assign,nonatomic)float autoSizeScaleY;//缩放Y
    
    @end
    AppDelegate.m
    //  登陆界面设计
    
    #import "AppDelegate.h"
    
    @interface AppDelegate ()
    
    @end
    
    @implementation AppDelegate
    
    
    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
       
       
        AppDelegate *myDelegate=[[UIApplication sharedApplication]delegate];
        if (ScreenHeight>480) {//屏幕高度大于4S的高度时 等比缩放操作
            myDelegate.autoSizeScaleX=ScreenWidth/320;//屏幕宽度缩放比率
            myDelegate.autoSizeScaleY=ScreenHeight/480;//屏幕高度缩放比率
        } else {
            myDelegate.autoSizeScaleX=1.0;
            myDelegate.autoSizeScaleY=1.0;
        }
        
    
        return YES;
    }

    2、在ViewController中实现的过程

    ViewController.h
    //  登陆界面设计
    #import <UIKit/UIKit.h>
    #import "AppDelegate.h"
    @interface ViewController : UIViewController<UITextFieldDelegate>
    @property(strong,nonatomic)UITextField *textNmae;//编辑文本框
    @property(strong,nonatomic)UIView *myView;//编辑下划线
    @property(strong,nonatomic)UIImageView *imageView;//图标
    @property(strong,nonatomic)UIButton *myButton;//控制按钮
    
    
    @end
    ViewController.m
    //  登陆界面设计
    
    #import "ViewController.h"
    
    @interface ViewController ()
    
    @end
    
    @implementation ViewController
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        //背景图
        self.imageView =[[UIImageView alloc]initWithImage:[UIImage imageNamed:@"beijing.png"]];
        //图标1
        [self.view addSubview:self.imageView];
        self.imageView=[[UIImageView alloc]initWithFrame:CGRectMake1(50,20, 200, 30)];
        self.imageView.image=[UIImage imageNamed:@"welcome@2x.png"];
        [self.view addSubview:self.imageView];
        
        //图标2
        [self.view addSubview:self.imageView];
        self.imageView=[[UIImageView alloc]initWithFrame:CGRectMake1(30,60, 20, 20)];
        self.imageView.image=[UIImage imageNamed:@"phoneIcon@2x.png"];
        [self.view addSubview:self.imageView];
    
        //图标3
        [self.view addSubview:self.imageView];
        self.imageView=[[UIImageView alloc]initWithFrame:CGRectMake1(30,100,20, 20)];
        self.imageView.image=[UIImage imageNamed:@"passwordIcon@2x.png"];
        [self.view addSubview:self.imageView];
        //图标4
        [self.view addSubview:self.imageView];
        self.imageView=[[UIImageView alloc]initWithFrame:CGRectMake1(100,400,100, 30)];
        self.imageView.image=[UIImage imageNamed:@"logo@2x.png"];
        [self.view addSubview:self.imageView];
        //下划线1
        self.myView=[[UIView alloc]initWithFrame:CGRectMake1(30, 85, 240, 1)];
        self.myView.backgroundColor=[UIColor whiteColor];
        [self.view addSubview:self.myView];
        //下划线2
        self.myView=[[UIView alloc]initWithFrame:CGRectMake1(30, 125, 240, 1)];
        self.myView.backgroundColor=[UIColor whiteColor];
        [self.view addSubview:self.myView];
       
        //文本编辑1
        self.textNmae=[[UITextField alloc]initWithFrame:CGRectMake1(60, 55, 210, 30)];
        self.textNmae.placeholder=@"请输入手机号";
        self.textNmae.font=[UIFont systemFontOfSize: 25];
        self.textNmae.alpha=0.5;
        self.textNmae.keyboardType = UIKeyboardTypeNumberPad;//键盘类型
        self.textNmae.clearButtonMode=UITextFieldViewModeAlways;//X总数存在
        [self.view addSubview:self.textNmae];
        
        //文本编辑2
        self.textNmae=[[UITextField alloc]initWithFrame:CGRectMake1(60, 95, 210, 30)];
        self.textNmae.placeholder=@"请输入密码";
        self.textNmae.secureTextEntry=YES;//安全密码
        self.textNmae.font=[UIFont systemFontOfSize: 25];
         self.textNmae.alpha=0.5;
         self.textNmae.delegate=self;
        self.textNmae.clearButtonMode=UITextFieldViewModeAlways;//X总数存在
        [self.view addSubview:self.textNmae];
        
        //登录按钮
        self.myButton=[[UIButton alloc]initWithFrame:CGRectMake1(30, 140, 240, 30)];
        [self.myButton setTitle:@"登录" forState:UIControlStateNormal];
        [self.myButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
        self.myButton.backgroundColor=[UIColor colorWithRed:arc4random()%256/255.0 green:arc4random()%256/255.0  blue:arc4random()%256/255.0  alpha:1.0];
        [self.myButton.layer setCornerRadius:10];//圆角
        [self.view addSubview:self.myButton];
        
        
        //注册按钮
        self.myButton=[[UIButton alloc]initWithFrame:CGRectMake1(30, 180, 240, 30)];
        [self.myButton setTitle:@"注册" forState:UIControlStateNormal];
        [self.myButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
        self.myButton.backgroundColor=[UIColor colorWithRed:arc4random()%256/255.0 green:arc4random()%256/255.0  blue:arc4random()%256/255.0  alpha:1.0];
        [self.myButton.layer setCornerRadius:10];//圆角
        [self.view addSubview:self.myButton];
    
        
    }
    //隐藏键盘
    -(BOOL)textFieldShouldReturn:(UITextField *)textField
    {
        if ([textField isFirstResponder]) {
            [textField resignFirstResponder];
        }
        return YES;
    }
    
    
    
    //适配缩放方法
      CG_INLINE CGRect
     CGRectMake1(CGFloat x, CGFloat y, CGFloat width, CGFloat height)
    {
        CGRect rect;
        AppDelegate *myDelegate=[[UIApplication sharedApplication]delegate];
        rect.origin.x=x*myDelegate.autoSizeScaleX;//坐标轴缩放
        rect.origin.y=y*myDelegate.autoSizeScaleY;
        rect.size.width=width*myDelegate.autoSizeScaleX;//尺寸缩放
        rect.size.height=height*myDelegate.autoSizeScaleY;
        return rect;
    
    }
  • 相关阅读:
    图片的下方与父元素有间隙兼容性解决方案
    vscode 实用插件
    给网页title前面上图标
    网站换肤
    基于面向对象编程的设计模式
    点击获取验证码进行60秒倒计时
    JVM--内存模型与线程
    JVM学习--jvm监控和故障处理工具
    JVM--GC学习
    JVM--Java类加载机制
  • 原文地址:https://www.cnblogs.com/guiyangxueyuan/p/5361294.html
Copyright © 2020-2023  润新知