CPF(暫時命名)(Cross platform framework),模仿WPF的框架,支持NETCore的跨平臺UI框架,暫時不夠完善,只用於測試,暫時只支持Windows和Mac。支持數據綁定,CSS,動畫。。。 可能有人會說,不是有個開源的Avalonia ,我試過,不過他的性能不行,啟動速 ...
CPF(暫時命名)(Cross platform framework),模仿WPF的框架,支持NETCore的跨平臺UI框架,暫時不夠完善,只用於測試,暫時只支持Windows和Mac。支持數據綁定,CSS,動畫。。。
可能有人會說,不是有個開源的Avalonia ,我試過,不過他的性能不行,啟動速度慢,記憶體占用高,附帶的dll一大堆,他的是Xaml來描述UI的,我的不提供Xaml,直接用C#來寫,以後將出設計器直接生成C#代碼。
CpfObject相當於WPF里的DependencyObject依賴對象。繼承該類的對象,所有屬性預設都是依賴屬性
屬性寫法:
1 /// <summary> 2 /// 綁定的數據上下文 3 /// </summary> 4 [PropertyMetadata(null)] 5 public object DataContext 6 { 7 get { return GetValue<object>(); } 8 set { SetValue(value); } 9 }
屬性上的特性可以是 PropertyMetadata或者UIPropertyMetadata 中的一個,預設值建議通過這兩個特性來設置。如果不加這兩個特性,那預設值就是null或者0
如果是複雜屬性類型預設值,可以通過重寫 OnOverrideMetadata 來設置
protected override void OnOverrideMetadata(OverrideMetadata overridePropertys) { base.OnOverrideMetadata(overridePropertys); overridePropertys.Override("StrokeStyle", new UIPropertyMetadataAttribute(new Stroke(1))); }
附加屬性:
/// <summary> /// 獲取或設置元素行索引 /// </summary> public static Attached<int> RowIndex { get { return RegisterAttached(0); } } Grid.RowIndex(control, 1);//使用附加屬性方式設置行索引 var index = Grid.RowIndex(control);//獲取附加屬性值
數據綁定:
var bind = label[nameof(Label.Text)] <= "Test";//右到左數據綁定,數據源是DataContext的屬性 var bind = label["Text"] >= "Test";//左到右數據綁定,數據源是DataContext的屬性 var bind = label["Text"] != "Test";//左到右數據綁定,只傳遞一次 ,數據源是DataContext的屬性 var bind = label["Text"] == "Test";//雙向綁定,數據源是DataContext的屬性,雙向綁定需要對象實現INotifyPropertyChanged var bind = label[nameof(Label.Text)] <= button["Test"];//右到左數據綁定 var bind = label[nameof(Label.Text)] >= button["Test"];//左到右數據綁定 var bind = label[nameof(Label.Text)] != button["Test"];//左到右數據綁定,只傳遞一次 var bind = label[nameof(Label.Text)] == button["Test"];//雙向綁定 btn.Bindings.Add(nameof(Button.Content), nameof(TextBlock.Text), null, BindingMode.OneWay, a => a.ToString());//通過Bindings屬性添加綁定,建議用nameof()這樣不容易寫錯
命令綁定:
當事件觸發或者屬性變化的時候調用方法
Label.Commands.Add(nameof(Window.MouseDown), nameof(Window.DragMove), Relation.Me.Parent);
new Button { Width = 20, Height = 20, MarginRight = 30, MarginTop = 5, Content = "Test", Commands = { { nameof(Button.MouseUp), ()=> { window.WindowState = WindowState.Minimized; } } } }
佈局系統
佈局流程和WPF差不多,先Measure再Arrange,如果自定義佈局容器,可以參考WPF的代碼
元素佈局,支持百分比佈局,margin調整定位,預設居中。相當於CSS里中的絕對定義position: absolute;
MarginLeft,MarginTop,MarginRight,MarginBottom,一般預設值是Auto,當設置值之後固定對應邊到父容器到內邊距的距離
Width,Height,一般預設值也是Auto,如果沒設置,實際尺寸由內容或者子元素尺寸決定,或者由Margin決定
new Border { Width = "100%", Height = "100%", Background = "#fff", }
屬性值的自動轉換:
Width = "100%"; Width = "Auto"; Width = 100; Background = Color.FromRgb(100,100,100); Background = "#fff"; Background =image;
CSS樣式
支持簡單的選擇器
TextBlock { Foreground:rgb(255,0,0);} 選擇所有TextBlock類型的元素
.test{Foreground:rgb(255,0,0);} 選擇所有包含test 類名的元素,類名通過Classes屬性添加
#test{Foreground:rgb(255,0,0);} 選擇所有Name屬性為test的元素
[IsMouseOver=true]{…} 添加觸發器
Button TextBlock{…} Button里的後代為TextBox的元素,只支持兩層
Button>TextBlock{…} Button直接子元素為TextBox的元素,只支持兩層
觸發器和動畫
.test[IsMouseOver=true]{animation-name:myfirst;animation-duration:1s;animation-iteration-count: 1;}
@keyframes myfirst
{
0% {Background: #f00;}
25% {Background: #0ff;}
50% {Background: #00f;}
100% {Background: #0f0;}
}
通過根元素的LoadStyle方法載入樣式,比如Window對象
控制項模板:
繼承你要修改的控制項,然後重寫InitializeComponent 把定義代碼寫在裡面,不知道怎麼定義?查看內置模板代碼,詳細模板代碼看壓縮包里的文檔,複製過去,自己根據需要修改
對Mac開發不熟悉,Mac系統下還不能輸入中文,有沒有猛男賜教一下,怎麼調用輸入法,打開關閉輸入法和控制輸入法候選詞位置
我感覺模板設計的不夠好,還有數據綁定還可以優化一下。各位有什麼想法和意見說說。