什么是控件？

• 按鈕（Button），按鈕常用于在單擊或觸摸時觸發(fā)操作。它們可以包含文本、圖標或兩者，并經(jīng)常用于提交表單、打開對話框或執(zhí)行命令等任務。
• 文本框（TextBox），文本框允許用戶輸入和編輯文本。它們用于捕獲用戶輸入，例如用戶名、密碼或任何形式的文本信息。文本框還可以根據(jù)特定輸入模式和驗證進行自定義。
• 標簽（Label），標簽用于顯示靜態(tài)文本或其他控件的標題。它們?yōu)橛脩籼峁╊~外的信息或上下文，通常是不可交互的。
• 復選框（CheckBox）和單選按鈕（RadioButton），復選框和單選按鈕用于選擇和多選項。復選框允許用戶選擇一個或多個選項，而單選按鈕允許用戶從一組選項中選擇一個。
• 滑動條（Slider），滑動條用于從范圍中選擇一個值。它們提供了一個可視化表示值的方式，可以通過拖動滑塊的手柄來調(diào)整值?；瑝K通常用于設(shè)置諸如音量控制或圖像調(diào)整等設(shè)置。
• 列表框（ListBox）和下拉列表框（ComboBox），列表框和下拉列表框允許用戶從列表或下拉菜單中選擇項目。列表框同時顯示多個項目，而下拉列表框在初始狀態(tài)下顯示一個項目，并在點擊時展開顯示列表。

內(nèi)置控件

• 繪制控件（Drawn Controls），繪制控件負責生成其自己的幾何圖形或位圖進行渲染，這些控件的示例包括Border，TextBlock，Image等。繪制控件是用于構(gòu)建其他所有內(nèi)容的基礎(chǔ)控件。大多數(shù)的繪制控件具有可以調(diào)整其外觀和大小的標準屬性，但它們不允許重新模板化。
• 布局控件（Layout Controls），布局控件是特殊的，它本身沒有外觀，但它可以定義子元素的布局，并充當父容器。子控件負責渲染UI，而布局父控件只設(shè)置大小和位置。
• 用戶控件（User Controls），Avalonia UI自身不會提供User Control，因為本身就是個性化的體現(xiàn)，并不具備通用性。
• 模板化控件（Templated Controls ），在Avalonia UI中，大部分的標準控件都是模板化控件，在應用程序開發(fā)中，可以更改模板化控件的XAML模板，使其外觀發(fā)生改變，而這也是基于XAML的UI框架中最強大的功能之一。

布局控件

1. Border    用邊框和背景裝飾單個子元素。
2. Canvas    在指定位置顯示子控件。
3. Dock Panel    將子控件沿指定邊緣（頂部、底部、左側(cè)、右側(cè)）排列，并使其中一個填充剩余空間。
4. Expander    具有標題區(qū)域（始終可見）和可折疊的內(nèi)容區(qū)域（單個子元素）。
5. Grid    將子控件排列在網(wǎng)格的單元格中，按行和列定位。單元格可以跨行和跨列。
6. Grid Splitter    可以添加到網(wǎng)格中，允許用戶在運行時調(diào)整行或列大小。
7. Panel    將子控件堆疊在一起。
8. Relative Panel    允許多個子控件。子控件的位置和對齊方式可以相對于面板本身指定，也可以相對于其他子控件指定?？梢灾付ㄗ涌丶拇笮?，也可以根據(jù)關(guān)系和對齊方式計算大小。
9. Scroll Viewer    如果（單個）子控件大于可用空間，則添加滾動條和滾動行為。
10. Split View    在其（單個子控件）內(nèi)容區(qū)域的邊緣添加可折疊的窗格。
11. Stack Panel    允許多個子控件，按順序水平或垂直排列。
12. Tab Control    標簽控件允許將視圖細分為標簽項。
13. Uniform Grid    允許多個子控件，以網(wǎng)格形式排列，單元格具有統(tǒng)一的列和行大小。
14. Wrap Panel    將子控件從左到右按順序排列，當寬度不足時，換行顯示。

1. Button    基本按鈕控件 - 可以顯示文本、圖標或兩者。具有標準的“點擊”行為。
2. Repeat Button    按鈕在按下并保持按住時重復引發(fā)其點擊事件。
3. Radio Button    按鈕具有選中狀態(tài)。它可以放置在一組中，以使一個按鈕的選擇取消所有其他按鈕的選擇。
4. Toggle Button    按鈕具有選中狀態(tài)和未選中狀態(tài)。后續(xù)點擊“切換”此狀態(tài)。通過“checked”偽類可以為選中狀態(tài)和未選中狀態(tài)分配不同的樣式。
5. Button Spinner    一個帶有兩個旋轉(zhuǎn)按鈕和內(nèi)容區(qū)域的控件。
6. Split Button    此按鈕具有主要和次要部分，可以獨立按下。主要部分的行為類似于標準按鈕，而次要部分則打開一個帶有附加操作的彈出菜單。
7. Toggle Split Button    此按鈕具有主要和次要部分，可以獨立按下。主要部分的行為類似于切換按鈕，而次要部分打開一個帶有附加操作的彈出菜單。

1. Data Grid    在可自定義的網(wǎng)格中顯示數(shù)據(jù)。
2. Items Control    顯示來自綁定數(shù)據(jù)源的項目集合。
3. Items Repeater    顯示來自綁定數(shù)據(jù)源的重復數(shù)據(jù)。它具有布局模板和數(shù)據(jù)模板。
4. List Box    一個包含可選擇項的控件。
5. Combo Box    一個帶有下拉列表的控件，其中的項目可以選擇。

1. Auto Complete Box    一個顯示文本框用于用戶輸入和一個下拉框，其中包含根據(jù)已輸入內(nèi)容可能匹配的項的控件。
2. Text Block    用于顯示文本塊的控件。只讀。
3. Text Box    用于顯示或編輯文本的控件，沒有格式限制。
4. Masked Text Box    用于在掩碼中顯示文本；或用于使用掩碼編輯文本，以防止無效的用戶輸入。

1. Check Box  ，  值類型為Boolean    以勾選標記形式表示的 True 值。點擊交互切換值。具有顯示“未知”值的選項。
2. Slider ，   值類型為Double    相對于最大值和最小值的相對值，以滑動條按鈕在滑動條軌道上的位置表示。拖動滑動條按鈕可以在最大值和最小值之間更改值。鍵盤和點擊交互也可以微調(diào)值。
3. Calendar ，   值類型為DateTime    日歷是用戶選擇日期或日期范圍的控件。
4. Calendar Date Picker ，   值類型為DateTime    日期選擇器的擴展，包括文本框和按鈕。
5. Color Picker，    值類型為Color / HsvColor    顏色選擇器支持用戶使用光譜、調(diào)色板和組件滑塊選擇和編輯顏色。它還支持可選的 alpha 分量、RGB 或 HSV 顏色模型和十六進制顏色值。
6. Date Picker  ，  值類型為DateTime    日期選擇器有三個“微調(diào)”控件，允許用戶選擇日期值。
7. Time Picker ，   值類型為TimeSpan    時間選擇器有三個“微調(diào)”控件，允許用戶選擇小時、分鐘和秒鐘。

1. Image    顯示位圖或矢量圖像。
2. Path Icon    使用當前的Foreground繪制矢量圖像。

1. Menu    顯示應用程序菜單。
2. Flyouts    將彈出菜單或上下文菜單附加到控件。
3. Tool Tip    當鼠標懸停在控件上時顯示工具提示。

創(chuàng)建控件

在實際應用中，如果默認提供的控件不能滿足業(yè)務需求，則需要創(chuàng)建新的控件，創(chuàng)建控件主要分為四個步驟：

1. 定義XAML：創(chuàng)建一個新的UserControl XAML文件，通過放置控件、設(shè)置屬性和應用樣式來定義控件的布局和外觀。
2. Code-behind：可選項，您可以定義額外的代碼后臺邏輯來處理事件、修改行為或為用戶控件提供額外的功能。
3. 重用和定制: 用戶控件可以在應用程序中輕松重用和定制。當您希望封裝一組特定的控件和行為為可重用的組件或"視圖"時，它們特別有用。

1. 定義控件類：創(chuàng)建一個新的類，該類派生自TemplatedControl。這個類定義了控件的行為、屬性和事件。
2. 控件模板：在XAML中創(chuàng)建一個ControlTheme，指定控件的視覺外觀和結(jié)構(gòu)?？丶０宥x了控件的部分以及它們應該如何被樣式化。
3. 樣式和模板化：應用程序開發(fā)人員可以通過修改控件模板或應用樣式來自定義控件的外觀。這樣可以實現(xiàn)應用程序中統(tǒng)一和統(tǒng)一的視覺設(shè)計。

1. 定義控件類：創(chuàng)建一個新的類，該類派生自Control。這個類將定義控件的行為和渲染邏輯。
2. 重寫Render方法：在控件類中重寫Render方法，并使用DrawingContext來繪制控件的內(nèi)容。

1. 樣式支持：可以通過樣式和在XAML或編程中定義的setter輕松地進行定位和修改。
2. 繼承：支持繼承，這意味著在父控件上定義的屬性值可以自動繼承到其子控件上，除非明確覆蓋。
3. 默認值：可以在控件級別或控件模板中指定默認值，確保在多個控件實例中保持一致的行為。
4. 屬性值優(yōu)先級：它們遵循明確定義的優(yōu)先級順序，允許根據(jù)本地值、樣式setter、觸發(fā)器和默認值等因素解析值。
5. 驗證和強制轉(zhuǎn)換：樣式化屬性允許控件驗證和強制轉(zhuǎn)換傳遞給它的值，確?？丶肋h不會處于無效狀態(tài)。

public class MyCustomButton : Button{    public static readonly StyledProperty<int> RepeatCountProperty =        AvaloniaProperty.Register<MyCustomButton, int>(nameof(RepeatCount), defaultValue: 1);
    public int RepeatCount    {        get => GetValue(RepeatCountProperty);        set => SetValue(RepeatCountProperty, value);    }}

1. 事件路由：路由事件可以沿著樹向上（冒泡）或向下（隧道）傳播，使得不同級別的控件可以處理相同的事件。這允許更靈活和集中的事件處理。
2. 事件處理程序：路由事件使用事件處理程序來響應事件。事件處理程序可以與特定控件關(guān)聯(lián)，也可以附加到視覺樹中的更高級別以處理來自多個控件的事件。
3. 已處理狀態(tài)：路由事件具有Handled屬性，可用于標記事件為已處理，阻止進一步的傳播。這允許對事件處理進行精細的控制。
4. 事件路由策略：Avalonia支持不同的路由策略，如冒泡、隧道和直接路由。這些策略決定了控件接收和處理事件的順序。 Avalonia的路由事件在需要處理可能發(fā)生在嵌套控件內(nèi)部的事件時特別有用，或者當您希望在視覺樹的較高級別集中事件處理邏輯時。

public class MyCustomSlider : Control{    public static readonly RoutedEvent<RoutedEventArgs> ValueChangedEvent =        RoutedEvent.Register<MyCustomSlider, RoutedEventArgs>(nameof(ValueChanged), RoutingStrategies.Direct);
    public event EventHandler<RoutedEventArgs> ValueChanged    {        add => AddHandler(ValueChangedEvent, value);        remove => RemoveHandler(ValueChangedEvent, value);    }
    protected virtual void OnValueChanged()    {        RoutedEventArgs args = new RoutedEventArgs(ValueChangedEvent);        RaiseEvent(args);    }}

參考文章

本文主要參考官方文檔：

https://docs./zh-Hans/docs/basics/user-interface/controls/

學習編程，從關(guān)注【老碼識途】開始，為大家分享更多文章！?。?/span>