Xamarin表單：IOS中的進度條高度問題

Question

我已經使用Xamarin Forms PCL項目創建了一個應用程序，該項目將在android，ios，windows 10和windows 8.1上運行。

其中我使用了progresbar控件，爲了增加它的高度，我製作了自定義的渲染器。

在PCL-

using Xamarin.Forms; 

namespace MyProject.ViewModels 
{ 
    public class CustomProgressbar : ProgressBar 
    { 
    } 
} 

在IOS-

using CoreGraphics; 
using MyProject.iOS; 
using Xamarin.Forms; 
using Xamarin.Forms.Platform.iOS; 
using FISE.ViewModels; 

[assembly: ExportRenderer(typeof(CustomProgressbar), typeof(CustomProgressBarRenderer))] 
namespace MyProject.iOS 
{ 

    public class CustomProgressBarRenderer : ProgressBarRenderer 
    { 
     protected override void OnElementChanged(ElementChangedEventArgs<ProgressBar> e) 
     { 
      base.OnElementChanged(e); 
      Control.ProgressTintColor = Color.FromHex(Constant.Primarycolor).ToUIColor(); 
      Control.TrackTintColor = Color.FromHex(Constant.Secondary1Color).ToUIColor(); 

     } 
     public override void LayoutSubviews() 
     { 
      base.LayoutSubviews(); 
      var X = 1f; 
      var Y = 10.0f; 
      CGAffineTransform transform = CGAffineTransform.MakeScale(X, Y); 
      // this.Control.Transform = transform; 
      this.Transform = transform; 

      //this.ClipsToBounds = true; 
      //this.Layer.MasksToBounds = true; 

     } 
    } 
} 

我用這個渲染提高進度的高度。首先我嘗試了this.Control.Transform = transform;，但我沒有爲我工作，然後我嘗試this.Transform = transform;然後它爲我工作。

現在我有5個進度條垂直堆疊一個接一個。

  <Grid Padding="20,3,0,0" x:Name="RatingCountDisplayGrid" RowSpacing="23" ColumnSpacing="10" Grid.Row="0" Grid.Column="1"> 
       <Grid.RowDefinitions> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="Auto" /> 
       </Grid.RowDefinitions> 
       <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="Auto"/> 
       </Grid.ColumnDefinitions> 

       <local1:CustomProgressbar Grid.Row="0" Grid.Column="0" HeightRequest="20" x:Name="fiveStarRating" /> 
       <Label x:Name="fiveStarRatingCount" Grid.Row="0" Grid.Column="1" FontAttributes="Bold" FontSize="14" Style="{DynamicResource LabelNormal3}"></Label> 
       <local1:CustomProgressbar Grid.Row="1" Grid.Column="0" HeightRequest="20" x:Name="fourStarRating"/> 
       <Label x:Name="fourStarRatingCount" Grid.Row="1" Grid.Column="1" FontAttributes="Bold" FontSize="14" Style="{DynamicResource LabelNormal3}"></Label> 
       <local1:CustomProgressbar Grid.Row="2" Grid.Column="0" HeightRequest="20" x:Name="threeStarRating"/> 
       <Label x:Name="threeStarRatingCount" Grid.Row="2" Grid.Column="1" FontAttributes="Bold" FontSize="14" Style="{DynamicResource LabelNormal3}"></Label> 
       <local1:CustomProgressbar Grid.Row="3" Grid.Column="0" HeightRequest="20" x:Name="twoStarRating"/> 
       <Label x:Name="twoStarRatingCount" Grid.Row="3" Grid.Column="1" FontAttributes="Bold" FontSize="14" Style="{DynamicResource LabelNormal3}"></Label> 
       <local1:CustomProgressbar Grid.Row="4" Grid.Column="0" HeightRequest="20" x:Name="oneStarRating"/> 
       <Label x:Name="oneStarRatingCount" Grid.Row="4" Grid.Column="1" FontAttributes="Bold" FontSize="14" Style="{DynamicResource LabelNormal3}"></Label> 
      </Grid> 

它看起來像這 -

之前將變換它看起來完美的屬性，但應用改造等兩項progressbars走出去父容器後。

Answer 1

在這裏你去... 嘗試這種解決方案：

protected override void OnElementChanged(
    ElementChangedEventArgs<Xamarin.Forms.ProgressBar> e) 
    { 
     base.OnElementChanged(e); 

     Control.ProgressTintColor = Color.FromHex("#01BC73").ToUIColor();// Color..FromHex("#254f5e").ToUIColor(); 
     Control.TrackTintColor = Color.White.ToUIColor(); 
     //Control.SetProgress(1, true); 

     //Control.Hidden = false; 
    } 

    public override CGSize SizeThatFits(CGSize size) 
    { 
     //size.Height = 100; 
     return base.SizeThatFits(size); 
    } 

    public override void LayoutSubviews() 
    { 
     //base.LayoutSubviews(); 

     //var X = 3.0f; 
     //var Y = 20.0f; // This changes the height 

     //CGAffineTransform transform = CGAffineTransform.MakeScale(X, Y); 
     //Control.Transform = transform; 

     //UpdateNativeWidget(); 
     CGAffineTransform transform = CGAffineTransform.MakeScale(1.27f, 80.0f); 
     transform.TransformSize(this.Frame.Size); 
     this.Transform = transform; 

    }