zoukankan      html  css  js  c++  java
  • xamarin.forms模拟rem动态大小值,实现屏幕适配

    开发app的时候,比较麻烦的地方,就是处理屏幕适配,比如文字设为12的大小,测试的时候,看得文字挺正常,可是,放到高分辨率设备一看,文字就变得特别小,

    怎样实现随着分辨率变大或者变小,所有的size数值,也会等比例变化呢?

    首先,在App类,加两个static变量,用来获取屏幕大小

    	public partial class App : Application
    	{
    		public App ()
    		{
    			InitializeComponent();
               
    			MainPage = new App1.MainPage();
    		}
                public static double ScreenWidth;
                public static double ScreenHeight;
    

      

    然后在android、ios等工程,设置这两个值

    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    	{
    		protected override void OnCreate (Bundle bundle)
    		{
    			TabLayoutResource = Resource.Layout.Tabbar;
    			ToolbarResource = Resource.Layout.Toolbar; 
    
    			base.OnCreate (bundle);
                    Resources.DisplayMetrics.ScaledDensity = 1;//告诉android不要把自己大小单位缩放
                    Resources.DisplayMetrics.Density = 1;
            App1.App.ScreenWidth = Resources.DisplayMetrics.WidthPixels;         App1.App.ScreenHeight = Resources.DisplayMetrics.HeightPixels;         //ios         //App.ScreenWidth = UIScreen.MainScreen.Bounds.Width/UIScreen.MainScreen.Scale;         //App.ScreenHeight = UIScreen.MainScreen.Bounds.Height/UIScreen.MainScreen.Scale;
                    //UWP
                    //App.ScreenWidth = ApplicationView.GetForCurrentView().VisibleBounds.Width
                    
                    //上面的公式ApplicationView.GetForCurrentView().VisibleBounds.Width其实不是实际的大小,而是 "真实Width/scale" 得出来的width
                    
    //var scale = DisplayInformation.GetForCurrentView().RawPixelsPerViewPixel
                        global::Xamarin.Forms.Forms.Init (this, bundle);
    			LoadApplication (new App1.App ());
    		}
    	}
    

      

    然后,建一个Helper类

    using System;
    using System.Collections.Generic;
    using System.Text;
    using Xamarin.Forms;
    
    namespace App1
    {
        public class Helper
        {
            public class PIXEL : Dictionary<string, double>
            {
    
                public new double this[string key]
                {
                    get
                    {
                        return Convert.ToDouble(key) * Helper.flag;
                    }
                    set
                    {
    
                    }
                }
            }
            public class MARGIN : Dictionary<string, Thickness>
            {
                public new Thickness this[string key]
                {
                    get
                    {
                        string[] p = key.Split('-');
                        if (p.Length == 1)
                            return new Thickness(Convert.ToDouble(p[0]) * Helper.flag);
                        return new Thickness(Convert.ToDouble(p[0]) * Helper.flag,
                            Convert.ToDouble(p[1]) * Helper.flag,
                            Convert.ToDouble(p[2]) * Helper.flag,
                            Convert.ToDouble(p[3]) * Helper.flag);
                    }
                    set
                    {
    
                    }
                }
            }
    
            public static double flag;
            public PIXEL px
            {
                get;
            }
            public MARGIN m
            {
                get;
            }
            public Helper()
            {
            //计算出屏幕缩放比例,640是你的UI原始设计图的高度 flag = App.ScreenWidth / 640.0; px = new PIXEL(); m = new MARGIN(); } } }

      

    在App.xaml里面定义资源

    <?xml version="1.0" encoding="utf-8" ?>
    <Application xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                  xmlns:local="clr-namespace:App1"
                 x:Class="App1.App">
    	<Application.Resources>
            <ResourceDictionary>
                <local:Helper x:Key="size"></local:Helper>
            </ResourceDictionary>
    		<!-- Application resource dictionary -->
    
    	</Application.Resources>
    </Application>
    

      

    然后,实际的窗口页面,就可以这样设置值了

    <?xml version="1.0" encoding="utf-8" ?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 xmlns:local="clr-namespace:App1"
                 x:Class="App1.MainPage">
        <Label Text="Welcome to Xamarin Forms!" 
               VerticalOptions="Start" BackgroundColor="AliceBlue" Margin="{Binding Source={StaticResource size},Path=m[10-0-0-0]}"
               HorizontalOptions="Start" FontSize="{Binding Source={StaticResource size},Path=px[10]}" />
    
    </ContentPage>
    

      

    这样,就可以实现屏幕适配,而且做界面很方便,所有大小,只要照着UI设计图,用photoshop量出来是多少像素,直接就在xaml里面填多少像素就可以

  • 相关阅读:
    数组的空位
    数组方法之pop
    数组方法之push
    深拷贝
    浅拷贝
    手动编写用于react项目开发的的webpack配置文件
    ES6:export default 和 export 区别
    JS基础算法题(二)
    Linux系统下用户如何膝盖FTP用户密码
    Sublime Text 3 安装插件与快捷键总结
  • 原文地址:https://www.cnblogs.com/IWings/p/6923044.html
Copyright © 2011-2022 走看看