Xamarin表单:IOS中的进度条高度问题

我已经创build了一个应用程序使用XamarinformsPCL项目,将在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; } } } 

我用这个渲染器来增加Progressbar的高度。 首先我试过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> 

看起来像这样 –

在这里输入图像说明

在应用Transform属性之前,它看起来很完美,但是在应用transform属性之后,两个progressbar会从父容器中走出来。

在这里你去…试试这个解决scheme:

 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; }