C#使用Xamarin開發可移植移動應用進階篇(6.使用渲染器針對單個平台自定義控件..很很很很重要..),附源碼

前言

系列目錄

C#使用Xamarin開發可移植移動應用目錄

源碼地址:https://github.com/l2999019/DemoApp

可以Star一下,隨意 - -

說點什么..

本篇..基本可以算是Xamarin在應用開發過程中的核心了..真的很很很重要..

想學習的..想用的..建議仔細閱讀..嗯..打醬油的 ..快速滑倒下面點個推薦 - - 哈哈哈...

今天的學習內容?

只講一個,關於Xamarin.Forms針對各個平台如何進行可定制化的控件操作.

也就是針對某個平台的細顆粒化操作.

廢話不多說,我們直接開始.

 

正文

1.什么是渲染器

自定義渲染器提供了一種強大的方法來定制Xamarin.Forms控件的外觀和行為。它們可用於一些微小的樣式更改或復雜的平台特定布局和行為定制。

2.為什么需要自定義渲染器

因為在不使用自定義渲染器的情況下更改Xamarin.Forms控件的外觀是顆粒度較粗的.

因為Xamarin.Forms為了支持多個平台同時可用,所以對一些特定平台的增強功能和自定義功能進行了刪減。所以當我們需要使用這些功能時，就必須實現自定義渲染器。

3.如何使用自定義渲染器

下面我們首先來通過一個例子來講解如何使用渲染器.

我們找到一個Xamarin控件,比如ProgressBar進度條..它在Xamarin中,可控的屬性應該就只有Progress進度而已..

我們編寫代碼如下:

<ProgressBar Progress=".5" BackgroundColor="Blue"   />

得到如下效果:

這里,我們特意給它加了一個藍色的背景..來展示整個控件的大小..

我們會發現,進度條只是他里面很小的一部分,大部分被背景占用,而且無法在Xamarin.Forms中去修改,我們無法改變它的高度.

那么,我們如何修改它呢?..這時候就要用自定義渲染器了,到特點的平台去優化它

首先我們在可移植的庫中自定義一個ProgressBar,方便Xamarin.Forms調用,代碼如下:

 public class MyProgressBar: ProgressBar
{
}

就這樣,就足夠了,我們只需要繼承一下原來的ProgressBar即可..

然后我們到安卓的平台下,添加自定義的渲染器.,記得,是安卓的平台,在這個類庫下:

添加渲染器,代碼如下:

//表示使用 Xamarin.Forms在使用MyProgressBar的時候,用MyProgressBarRenderer渲染替換
[assembly: ExportRenderer(typeof(MyProgressBar), typeof(MyProgressBarRenderer))]
namespace DemoApp.Droid
{
    public class MyProgressBarRenderer:ProgressBarRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.ProgressBar> e)
        {
            base.OnElementChanged(e);

            Control.ScaleY = 10; //改變Y軸大小
           
            Control.SetPadding(-0, -12, 0, -12);


        }
    }
}

上面的代碼有2個關鍵的地方,一個是需要在命名空間上申明,你需要代替渲染的控件.

第二個是,你需要繼承相關的渲染基類,比如我們這里用的ProgressBarRenderer

我們可以看看這里基類里面繼承了一些什么,如下:

我們可以看到,在安卓庫中,它就繼承了安卓widget的原生進度條,那么,原生進度條的所有屬性,我們就都是可以用的了.

比如我們在代碼中寫的 "ScaleY" 這種屬性和SetPadding這種方法.,所以前面我一直強調的,有些東西 你找了安卓(IOS)的解決方案,就同樣找到了Xamarin的

我這里雖然沒有IOS的環境,但是我們也可以到IOS里面看看ProgressBarRenderer繼承了什么,如下:

熟悉IOS開發的同學應該很清楚了..Uikit..就是IOS的用戶界面

 

在上面的代碼中,我們針對安卓平台,修改了他的Y軸高度和內邊距的值,我們如何使用呢?如下:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:loact="clr-namespace:DemoApp.MyRenderer"
             x:Class="DemoApp.ViewsDomePage">
    <ContentPage.Content>
<loact:MyProgressBar Progress=".6" BackgroundColor="Red"  />
                <ProgressBar Progress=".5" BackgroundColor="Blue" MinimumHeightRequest="-20" HeightRequest="-1"  />
    </ContentPage.Content>
</ContentPage>

我們在ContentPage 中,先引入我們自定的命名空間,調用名改為loact.

然后就直接loact:MyProgressBar,就可以了和原來幾乎沒區別.

然后我們看看運行效果,如下:

我們可以看到,雖然我們也給了紅色的背景,但是它只顯示在進度條中了,不會讓控件很高, SetPadding起了作用.

當然,我們能操作的遠遠不止這些..

下面直接給上一個我搭好的基礎框架的效果吧...嗯 還使用了一下百度地圖的原生SDK.

 

 

 

 

 

 

寫在最后

嗯..也沒啥好說的了. 后面慢慢加深.

.最后,謝謝各位的支持,喜歡請點個推薦