win10 uwp 簡單製作一個 Path 路徑繪製的圖標按鈕

来源:https://www.cnblogs.com/lindexi/archive/2023/09/21/17719024.html
-Advertisement-
Play Games

關於Unity 如何與Blazor Server結合 一、介紹 最近工作中有Unity與Blazor Server結合的需求,在網上找了一圈,發現這方面的資料比較少,特此寫下這篇記錄一下自己的實現過程,希望可以幫到有需要的朋友。(下方多圖預警) OS Version : windows 11 Uni ...


本文告訴大家在 UWP 或 WinUI 3 裡面如何簡單製作一個由 Path 幾何路徑圖形繪製的圖標按鈕

先在資源裡面定義按鈕的樣式,重寫 Template 屬性,通過在 Template 裡面放入 Path 綁定 Data 到內容從而實現讓 Path 顯示集合路徑圖形,代碼如下

        <Style x:Key="Style.TitlebarButton" TargetType="Button">
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="#808080" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Top" />
            <Setter Property="Width" Value="24"/>
            <Setter Property="Height" Value="24"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ButtonBase">
                        <Grid Background="{TemplateBinding Background}">
                            <Path Fill="{TemplateBinding Foreground}" Data="{TemplateBinding Content}"></Path>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

接下來有路徑資源可以先在資源字典裡面定義,定義的是字元串即可,如以下代碼

        <x:String x:Key="Geometry.Close">M18.363961,5.63603897 C18.7544853,6.02656326 18.7544853,6.65972824 18.363961,7.05025253 L13.4142136,12 L18.363961,16.9497475 C18.7544853,17.3402718 18.7544853,17.9734367 18.363961,18.363961 C17.9734367,18.7544853 17.3402718,18.7544853 16.9497475,18.363961 L12,13.4142136 L7.05025253,18.363961 C6.65972824,18.7544853 6.02656326,18.7544853 5.63603897,18.363961 C5.24551468,17.9734367 5.24551468,17.3402718 5.63603897,16.9497475 L10.5857864,12 L5.63603897,7.05025253 C5.24551468,6.65972824 5.24551468,6.02656326 5.63603897,5.63603897 C6.02656326,5.24551468 6.65972824,5.24551468 7.05025253,5.63603897 L12,10.5857864 L16.9497475,5.63603897 C17.3402718,5.24551468 17.9734367,5.24551468 18.363961,5.63603897 Z</x:String>

這裡有一個細節點是在 UWP 或 WinUI 3 里,字元串類型應該使用 x:String 而不是使用 system:String 的方式,如以下錯誤的代碼例子

<Page
    x:Class="LefernochihairWhemfawqarkemche.MainPage"
    ...
    xmlns:system="using:System">

    <Page.Resources>
        <system:String x:Key="Geometry.Close">M18.363961,5.63603897 C18.7544853,6.02656326 18.7544853,6.65972824 18.363961,7.05025253 L13.4142136,12 L18.363961,16.9497475 C18.7544853,17.3402718 18.7544853,17.9734367 18.363961,18.363961 C17.9734367,18.7544853 17.3402718,18.7544853 16.9497475,18.363961 L12,13.4142136 L7.05025253,18.363961 C6.65972824,18.7544853 6.02656326,18.7544853 5.63603897,18.363961 C5.24551468,17.9734367 5.24551468,17.3402718 5.63603897,16.9497475 L10.5857864,12 L5.63603897,7.05025253 C5.24551468,6.65972824 5.24551468,6.02656326 5.63603897,5.63603897 C6.02656326,5.24551468 6.65972824,5.24551468 7.05025253,5.63603897 L12,10.5857864 L16.9497475,5.63603897 C17.3402718,5.24551468 17.9734367,5.24551468 18.363961,5.63603897 Z</system:String>
    </Page.Resources>
    <Grid>
    </Grid>
</Page>

以上的代碼可能拋出的是 Microsoft.UI.Xaml.Markup.ReflectionHelperException Error in reflection helper. Please add '<PropertyGroup><EnableTypeInfoReflection>false</EnableTypeInfoReflection></PropertyGroup>' to your project file.. Created Xaml type 'String' has a different name than requested type 'System.String' 錯誤,也可能拋出的是 Windows.UI.Xaml.Markup.XamlParseException: XAML parsing failed. 異常。這幾個異常這麼奇怪,其實是微軟從 2015 開始就毫無長進的 WinUI 異常提示機制,由於經過了 COM 的 WinUI 底層,導致了上層拋出的不是本質的異常,也不知道是哪一行,只能依靠逐步靜態閱讀代碼和不斷運行嘗試才能知道是哪裡寫錯了

回到使用代碼裡面,圖標按鈕的使用方法特別簡單,只需要將以上的 x:String 的幾何路徑設置到按鈕的內容,然後設置按鈕的樣式就完成

        <Button Style="{StaticResource Style.TitlebarButton}" Content="{StaticResource Geometry.Close}"></Button>

如此簡單即可完成圖標按鈕

為了防止大家不知道上文給的代碼是寫到哪裡,下麵給出頁面的代碼,可以拷貝在自己的項目里瞭解效果

<Page
    x:Class="LefernochihairWhemfawqarkemche.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:LefernochihairWhemfawqarkemche"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:system="using:System"
    xmlns:helpers="using:LefernochihairWhemfawqarkemche.Helpers"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Page.Resources>
        <x:String x:Key="Geometry.Close">M18.363961,5.63603897 C18.7544853,6.02656326 18.7544853,6.65972824 18.363961,7.05025253 L13.4142136,12 L18.363961,16.9497475 C18.7544853,17.3402718 18.7544853,17.9734367 18.363961,18.363961 C17.9734367,18.7544853 17.3402718,18.7544853 16.9497475,18.363961 L12,13.4142136 L7.05025253,18.363961 C6.65972824,18.7544853 6.02656326,18.7544853 5.63603897,18.363961 C5.24551468,17.9734367 5.24551468,17.3402718 5.63603897,16.9497475 L10.5857864,12 L5.63603897,7.05025253 C5.24551468,6.65972824 5.24551468,6.02656326 5.63603897,5.63603897 C6.02656326,5.24551468 6.65972824,5.24551468 7.05025253,5.63603897 L12,10.5857864 L16.9497475,5.63603897 C17.3402718,5.24551468 17.9734367,5.24551468 18.363961,5.63603897 Z</x:String>

        <Style x:Key="Style.TitlebarButton" TargetType="Button">
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="#808080" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Top" />
            <Setter Property="Width" Value="24"/>
            <Setter Property="Height" Value="24"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ButtonBase">
                        <Grid Background="{TemplateBinding Background}">
                            <Path Fill="{TemplateBinding Foreground}" Data="{TemplateBinding Content}"></Path>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Page.Resources>
    <Grid>
        <Button Style="{StaticResource Style.TitlebarButton}" Content="{StaticResource Geometry.Close}" Click="Button_OnClick"></Button>
    </Grid>
</Page>

博客園博客只做備份,博客發佈就不再更新,如果想看最新博客,請到 https://blog.lindexi.com/

知識共用許可協議
本作品採用知識共用署名-非商業性使用-相同方式共用 4.0 國際許可協議進行許可。歡迎轉載、使用、重新發佈,但務必保留文章署名[林德熙](https://www.cnblogs.com/lindexi)(包含鏈接:https://www.cnblogs.com/lindexi ),不得用於商業目的,基於本文修改後的作品務必以相同的許可發佈。如有任何疑問,請與我[聯繫](mailto:[email protected])。
您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 目錄一、爬取目標二、爬取結果三、代碼講解四、技術總結五、演示視頻六、附完整源碼 一、爬取目標 您好!我是@馬哥python說,一名10年程式猿。 今天分享一期爬蟲案例,爬取的目標是:今日頭條熱榜的榜單數據。 打開今日頭條 首頁,在頁面右側會看到頭條熱榜,如下: 爬取以上6個關鍵欄位,含: 熱榜排名, ...
  • Sunday 演算法是一種字元串搜索演算法,由`Daniel M.Sunday`於1990年開發,該演算法用於在較長的字元串中查找子字元串的位置。演算法通過將要搜索的模式的字元與要搜索的字元串的字元進行比較,從模式的最左側位置開始。如果發現不匹配,則演算法將模式向右`滑動`一定數量的位置。這個數字是由當前文本... ...
  • matplotlib的動畫一直是一個強大但使用頻率不高的功能,究其原因,一方面展示動畫需要一定的媒介,沒有圖形和文字展示方便;二來大家更關心的是分析結果的最終圖表,圖表的動態展示則沒有那麼重要。 不過,隨著短視頻的興起,在短視頻平臺上展示動畫變得非常容易,所以,我們發現有越來越多的數據分析動畫(比如 ...
  • 一、openKylin簡介 openKylin(開放麒麟) 社區是在開源、自願、平等和協作的基礎上,由基礎軟硬體企業、非營利性組織、社團組織、高等院校、科研機構和個人開發者共同創立的一個開源社區,致力於通過開源、開放的社區合作,構建桌面操作系統開源社區,推動Linux開源技術及其軟硬體生態繁榮發展。 ...
  • 在我們視窗新增、編輯狀態下的時候,我們往往會根據是否修改過的痕跡-也就是臟數據狀態進行跟蹤,如果用戶發生了數據修改,我們在用戶退出視窗的時候,提供用戶是否丟棄修改還是繼續編輯,這樣在一些重要錄入時的時候,可以避免用戶不小心關掉視窗,導致視窗的數據要重新錄入的尷尬場景。本篇隨筆介紹基於WPF開發中,窗... ...
  • 一、介紹 今天突然想起之前工作上遇到的一個問題,在做Blazor 開發時後端給的一個介面請求方式是Post ,但是他需要攜帶多個參數,新建一個公共類又覺得麻煩,我就嘗試著怎麼在Post請求中攜帶多個參數,由於接觸Asp .Net Core 的時間不夠長,所以這些都不是太瞭解, 今天寫下這篇文章做個記 ...
  • Denpendcy Injection 8.0新功能——KeyedService 本文只介紹 .NET Denpendcy Injection 8.0新功能——KeyedService,假定讀者已熟練使用之前版本的功能。 註冊帶Key的類 8.0之前,註冊一個類往往是AddSingleton<IFo ...
  • 一:背景 1. 講故事 前些天有位朋友找到我,說他的程式記憶體異常高,用 vs診斷工具 載入時間又太久,讓我幫忙看一下到底咋回事,截圖如下: 確實,如果dump文件超過 10G 之後,市面上那些可視化工具分析起來會讓你崩潰的,除了時間久之外這些工具大多也不是用懶載入的方式,比如 dotmemory 會 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...