所有平台都具有相同的字体

时间:2017-07-12 09:18:17

标签: xamarin xamarin.ios xamarin.android xamarin.forms

我希望所有平台的字体大小均匀,因为ios和android中的默认字体大小对于微小,中,大都有不同的值。例如ios中的defualt fontsize是17,而在android中它是15 FontSize medium in ios是17,而在android中是18。如何在xamarin.forms中为所有平台制作统一的?

2 个答案:

答案 0 :(得分:3)

这对我有用(Xamarin.Forms 2.3.3.175):

在app.xaml:

 <ResourceDictionary>
 <OnPlatform x:Key="SmallTextSize" x:TypeArguments="x:Double" 
 iOS="12.0" Android="12.0" WinPhone="14.0" />

 <Style TargetType="MyCustomLabel">
 <Setter Property="TextColor" Value="#3399FF" />
 <Setter Property="FontSize" Value="{DynamicResource SmallTextSize}"/>
 </Style>
</ResourceDictionary>

在view.xaml:

<StackLayout>
  <c:MyCustomLabel Text="{Binding TextField1}"/>
  <c:MyCustomLabel Text="{Binding TextField2}" 
   FontAttributes="Bold"/>
 </StackLayout>

第一个“MyCustomLabel”将从Style中分配FontSize = SmallTextSize和TextColor,第二个“MyCustomLabel”将被赋予FontAttributes = Bold,但它将保留由Style指定的FontSize = SmallTextSize。

如果你正在使用x:TypeArguments =“Font”,如上所述,覆盖FontAttributes也会重置Style中指定的FontSize。

https://jfarrell.net/2015/02/07/platform-specific-styling-with-xamarin-forms/

答案 1 :(得分:0)

您必须根据标签字体大小

计算屏幕高度和宽度

以下代码将有助于根据移动屏幕的高度和宽度设计移动屏幕。

基于此的设计将适合所有移动分辨率。

<强> PCL:

<强> App.cs

public class App : Application
{                     
public static int screenHeight, screenWidth;

public App()
{           
    MainPage = new UserLogin();
    //The root page of your application         
}

protected override void OnStart()
{
     // Handle when your app starts
}

protected override void OnSleep()
{
    // Handle when your app sleeps
}

protected override void OnResume()
{
    // Handle when your app resumes
  }
}

<强> Xamarin.Android:

MainActivity.cs

#region用于屏幕高度&amp;宽度

    var pixels = Resources.DisplayMetrics.WidthPixels;
    var scale = Resources.DisplayMetrics.Density;

    var dps = (double)((pixels - 0.5f) / scale);

    var ScreenWidth = (int)dps;

    App.screenWidth = ScreenWidth;

    //RequestedOrientation = ScreenOrientation.Portrait;

    pixels = Resources.DisplayMetrics.HeightPixels;
    dps = (double)((pixels - 0.5f) / scale);

    var ScreenHeight = (int)dps;
    App.screenHeight = ScreenHeight;

endregion

<强> Xamarin.iOS

<强> AppDelegate.cs

#region For Screen Height & Width

  App.screenWidth = (int)UIScreen.MainScreen.Bounds.Width;
      App.screenHeight = (int)UIScreen.MainScreen.Bounds.Height;

#endregion

<强> PCL

如果您使用MVVM模式,则必须在ViewModel中获取这些ScreeenHeight和ScreenWidth然后为视图和布局提供高度和宽度。

         // The below two lines will use to get the MOBILE SCREEN HEIGHT && WIDTH in ViewModel
          int heightScreen=App.screenHeight;
          int widthScreen=App.screenHeigh

XAML设计:

<强> UserLogin.xaml

   <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:local="clr-
  SreenSizeDemo;assembly=SreenSizeDemo" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
   x:Class="SreenSizeDemo.UserLogin">
  <StackLayout>
   <Label x:Name="lblTitle" HorizontalOptions="FillAndExpand"/>
   <Image x:Name="imgProfile"  Source="Logo.png" />
  <StackLayout>
  <ContentPage>

<强> UserLogin.xaml.cs

  public partial class UserLogin : ContentPage
  {
          // Here you get the MOBILE SCREEN HEIGHT && WIDTH
          int heightScreen=App.screenHeight;
          int widthScreen=App.screenHeight;

 public UserLogin()
     {
                       lblTitle.FontSize=height=Screen/36.8;
                     //The above value is equal to fontsize =20
                     imgProfile.HeightRequest=heightScreeen/10;
                     imgProfile. WidthRequest=heightScreeen/10;
            }
    }

C#Design:

 public class UserLogin: ContentPage
      {
          // Here you get the MOBILE SCREEN HEIGHT && WIDTH
          int heightScreen=App.screenHeight;
          int widthScreen=App.screenHeight;

          public UserLogin()
               {
                   Label lab = new Label()
                    {
                      FontSize = heightScreen/ 36.8
                      //the above value is equal to fontsize =20
                    };

                   Image imgProfile=new Image()
                    {
                         Source="Logo.png",
                         HeightRequest=heightScreeen/10,
                         WidthRequest=heightScreeen/10
                  }
          }
   }

这是另一种方式,但我认为这不是正确的方式