使用 Xamarin Forms 在 UWP 中自定义进度条颜色

Question

我进行了进度条自定义（自定义渲染器）以更改 iOS 和 Droid 中的进度条颜色，如下所示

自定义进度条 class 在 PCL:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;

namespace App2
{
   public class ColorProgressBar : ProgressBar
    {
        public static BindableProperty BarColorProperty
            = BindableProperty.Create<ColorProgressBar, Color>(p => 
                     p.BarColor, default(Color));

        public Color BarColor
           {
             get { return (Color)GetValue(BarColorProperty); }
             set { SetValue(BarColorProperty, value); }
           }
     }
  }

iOS 的自定义渲染器：

using App2;
using App2.iOS;
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using Xamarin.Forms;

//using MonoTouch.Foundation;
//using MonoTouch.UIKit;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(ColorProgressBar), 
typeof(ColorProgressBarRenderer))]

namespace App2.iOS
{
  public class ColorProgressBarRenderer : ProgressBarRenderer
    {
      public ColorProgressBarRenderer()
      { }

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

         if (e.NewElement == null)
             return;

         if (Control != null)
         {
            UpdateBarColor();
         }
       }

       protected override void OnElementPropertyChanged(object sender, 
       PropertyChangedEventArgs e)
        {
          base.OnElementPropertyChanged(sender, e);

          if (e.PropertyName == 
              ColorProgressBar.BarColorProperty.PropertyName)
           {
             UpdateBarColor();
           }
         }
        private void UpdateBarColor()
         {
            var element = Element as ColorProgressBar;
            Control.TintColor = element.BarColor.ToUIColor();
         }
      }
  }

Android 的自定义渲染器：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.Renderscripts;
using static Java.Util.ResourceBundle;
using Xamarin.Forms.Platform.Android;
using Android.Graphics;
using System.ComponentModel;
using Xamarin.Forms;
using App2;
using App2.Droid;

[assembly: ExportRenderer(typeof(ColorProgressBar), 
                        typeof(ColorProgressBarRenderer))]
namespace App2.Droid
{
    public class ColorProgressBarRenderer : ProgressBarRenderer
    {
        public ColorProgressBarRenderer()
        { }

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

                  if (e.NewElement == null)
                      return;

                  if (Control != null)
                   {
                      UpdateBarColor();
                   }
               }

       protected override void OnElementPropertyChanged(object sender, 
       PropertyChangedEventArgs e)
              {
                 base.OnElementPropertyChanged(sender, e);

                 if (e.PropertyName == 
                      ColorProgressBar.BarColorProperty.PropertyName)
                    {
                      UpdateBarColor();
                    }
              }

       private void UpdateBarColor()
              {
                var element = Element as ColorProgressBar;
                // 
               Control.IndeterminateDrawable.SetColorFilter( 
               element.BarColor.ToAndroid(), PorterDuff.Mode.SrcIn);
               Control.ProgressDrawable.SetColorFilter( 
               element.BarColor.ToAndroid(), PorterDuff.Mode.SrcIn);
              }
     }
}

我是这样设置自定义进度条的颜色的：

var progressBar = new ColorProgressBar();
progressBar.BarColor = Color.Red;

我不明白如何为更改进度条颜色的 UWP 创建自定义渲染器 class。有人可以帮助我了解如何执行此操作吗class?

Answer 1

您将要更新本机 Windows.UI.Xaml.Controls.ProgressBar 控件的 Foreground 属性以更改颜色。

它应该看起来像这样：

private void UpdateBarColor()
{
    var element = Element as ColorProgressBar;
    Control.Foreground = new Windows.UI.Xaml.Media.SolidColorBrush(
        GetWindowsColor(element.BarColor));
}

Windows.UI.Color GetWindowsColor(Color color)
{
    return Windows.UI.Color.FromArgb((byte)(255 * color.A), (byte)(255 * color.R), (byte)(255 * color.G), (byte)(255 * color.B));
}

这将使用您的 BarColor，用它制作正确颜色的 SolidColorBrush，然后将其分配给您的原生 ProgressBar 控件。

使用 Xamarin Forms 在 UWP 中自定义进度条颜色

Customizing the progress bar color in UWP using Xamarin Forms

custom-renderer

xamarin

xamarin.forms

xamarin.uwp