這篇文章運用簡單易懂的例子給大家介紹自定義XamlCompositionBrushBase實現(xiàn)圖片平鋪的方法，文章內(nèi)容步步緊湊，希望大家根據(jù)這篇文章可以有所收獲。
我早就想試試自定義XamlCompositionBrushBase，但一直沒機會。上一篇文章介紹到使用Win2D的BorderEffect實現(xiàn)圖片的平鋪功能，原理很簡單，但每次都要寫這些代碼很繁瑣，正好就用這個作為例子試試XamlCompositionBrushBase。
CompositionBrush靈活多變，它的基本用法如下：
這些步驟很繁瑣，而且不能用在XAML中。XamlCompositionBrushBase提供了將CompositionBrush用在XAML中一個橋梁，他繼承自Brush類，可以直接像普通的XAML 畫筆（如SolidColorBrush）那樣直接用在XAML中。
Windows Community Toolkit中已經(jīng)提了很不少XamlCompositionBrushBase的實現(xiàn)，它們的使用方式已經(jīng)有很多文章介紹，這里不一一列舉。
這篇文章將介紹一個自定義的畫筆：TiledImageBrush，它的主要目標是實現(xiàn)ImageBrush沒有的圖片平鋪功能，并且它可以在XAML中使用，使用方式如下：
重慶分公司
重慶分公司
順便復習下普通的ImageBrush的用法：
看起來TiledImageBrush的用法是不是和ImageBrush很像？接下來講解TiledImageBrush的實現(xiàn)步驟。TiledImageBrush繼承自XamlCompositionBrushBase，而實現(xiàn)XamlCompositionBrushBase的一般步驟如下：
protected override void OnConnected()
{
// Delay creating composition resources until they're required.
if (CompositionBrush == null)
{
CompositionBrush = CreateCompositionBrush();//Create A CompositionBrush.
}
}
protected override void OnDisconnected()
{
// Dispose of composition resources when no longer in use.
if (CompositionBrush != null)
{
CompositionBrush.Dispose();
CompositionBrush = null;
}
}首先重寫OnConnected，當畫筆在屏幕上首次用于繪制元素時會調(diào)用這個函數(shù)。在這個函數(shù)里創(chuàng)建CompositionBrush并賦值給XamlCompositionBrushBase.CompositionBrush。
然后重寫OnDisconnected，它在畫筆不再用于繪制任何元素時被調(diào)用。在這個函數(shù)里盡可能地釋放各種資源，例如CompositionBrush。這兩步就是實現(xiàn)XamlCompositionBrushBase的基本步驟。
創(chuàng)建CompositionBrush有很多種玩法，我之前寫過兩篇文章分別介紹 CompositionBrush入門及 在CompositionBrush上使用Effect。這里使用使用Win2D的BorderEffect實現(xiàn)圖片的平鋪功能這篇文章里介紹到的代碼，首先使用LoadedImageSurface.StartLoadFromUri創(chuàng)建CompositionSurfaceBrush，然后加入到BorderEffect里實現(xiàn)圖片平鋪，然后把產(chǎn)生的CompositionEffectBrush賦值給XamlCompositionBrushBase.CompositionBrush。
TiledImageBrush中添加了Source屬性用于設(shè)置圖片Uri（實際上是個ImageSource類型），模仿ImageBrush，這里的Source也是一個ImageSource類型的屬性，雖然實際上使用的是它的UriSource。詳細代碼如下：
public ImageSource Source
{
get => (ImageSource)GetValue(SourceProperty);
set => SetValue(SourceProperty, value);
}
private void UpdateSurface()
{
if (Source != null && _surfaceBrush != null)
{
var uri = (Source as BitmapImage)?.UriSource ?? new Uri("ms-appx:///");
_surface = LoadedImageSurface.StartLoadFromUri(uri);
_surfaceBrush.Surface = _surface;
}
}OnConnected的詳細代碼如下：
protected override void OnConnected()
{
base.OnConnected();
if (CompositionBrush == null)
{
_surfaceBrush = Compositor.CreateSurfaceBrush();
_surfaceBrush.Stretch = CompositionStretch.None;
UpdateSurface();
_borderEffect = new BorderEffect()
{
Source = new CompositionEffectSourceParameter("source"),
ExtendX = Microsoft.Graphics.Canvas.CanvasEdgeBehavior.Wrap,
ExtendY = Microsoft.Graphics.Canvas.CanvasEdgeBehavior.Wrap
};
_borderEffectFactory = Compositor.CreateEffectFactory(_borderEffect);
_borderEffectBrush = _borderEffectFactory.CreateBrush();
_borderEffectBrush.SetSourceParameter("source", _surfaceBrush);
CompositionBrush = _borderEffectBrush;
}
}上文描述的就是自定義XamlCompositionBrushBase實現(xiàn)圖片平鋪的方法，具體使用情況還需要大家自己動手實驗使用過才能領(lǐng)會。如果想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)cdcxhl.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機、免備案服務(wù)器”等云主機租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
