2015-11-06 57 views
1

我正在通過Charles Petzold的「使用Xamarin.Forms Preview Edition 2創建移動應用程序」的方式工作,我正在玩弄第4章中的最後一個代碼示例,背景顏色來查看元素的各種邊界框。Xamarin在iOS和Android之間形成文本佈局差異

但是,當我在Android上運行測試應用程序時,我注意到在Android上,在添加到textStack的每個文本標籤上添加了一個額外的「框」。

但是,一張圖片勝過一千多字:

這是從我的IOS版本的輸出:http://imgur.com/foJxAQp

這是我的Android版本的輸出:http://imgur.com/3gpO4pG

正如你可以看到,在Android版本中,每個顯示的文本標籤上方都有一個「額外」藍色框。

這是我第4章BlackCatPage類的代碼,這是幾乎一樣的一個在這本書雖然有些顏色變化:

using System; 
using System.IO; 
using System.Reflection; 

using Xamarin.Forms; 

namespace BlackCat 
{ 
    public class BlackCatPage : ContentPage 
    { 
     public BlackCatPage() 
     { 
      StackLayout mainStack = new StackLayout(); 
      StackLayout textStack = new StackLayout { 
       Padding = new Thickness (5), 
       Spacing = 10, 
       BackgroundColor = Color.Red 
      }; 

      Assembly assembly = GetType().GetTypeInfo().Assembly; 
      String resource = "BlackCat.Texts.lorem.txt"; 

      using(Stream stream = assembly.GetManifestResourceStream(resource)) { 
       using(StreamReader reader = new StreamReader(stream)) { 
        bool gotTitle = false; 
        string line; 

        while(null != (line = reader.ReadLine())) { 
         Label label = new Label { 
          Text = line, 
          TextColor = Color.White, 
          BackgroundColor = Color.Blue 
         }; 

         if(!gotTitle) { 
          label.HorizontalOptions = LayoutOptions.Center; 
          label.FontSize = Device.GetNamedSize(NamedSize.Medium, label); 
          label.FontAttributes = FontAttributes.Bold; 
          label.TextColor = Color.Black; 
          label.BackgroundColor = Color.Yellow; 
          mainStack.Children.Add(label); 
          gotTitle = true; 
         } 
         else { 
          textStack.Children.Add(label); 
         } 
        } 
       } 
      } 

      ScrollView scrollView = new ScrollView { 
       Content = textStack, 
       VerticalOptions = LayoutOptions.FillAndExpand, 
       Padding = new Thickness(5, 0) 
      }; 

      mainStack.Children.Add(scrollView); 

      Content = mainStack; 

      BackgroundColor = Color.White; 

      Padding = new Thickness(0, Device.OnPlatform(20, 0, 0), 0, 0); 
     } 
    } 
} 

我想了解爲什麼在Android上有一個額外的藍色框呈現。

回答

1

我想出了這個問題。空行!

我的文本來源包含段落之間的空行。 iOS和Android似乎在呈現這些內容方面略有差異。即,iOS似乎跳過了它們,而Android似乎也包含了它們(不知道爲什麼)。

總之,知道什麼導致的問題,暫時將一個簡單的空行檢查,以避免創建一個空Label的似乎做的工作:

while(null != (line = reader.ReadLine())) { 
    if (line.Trim().Length == 0) { 
    continue; 
    } 

    ... 
} 
相關問題