Markup C# generasi berikutnya yang ringkas untuk kerangka kerja .NET UI
C# Markup 2 mendukung beberapa kerangka UI, termasuk Platform Uno yang luar biasa .
Jika Anda belum mengenal Uno, saya sarankan Anda memeriksanya; Uno adalah salah satu kerangka kerja .NET UI terbaik dan paling matang, ia menawarkan beragam fitur mengesankan yang akan mendukung Anda saat Anda perlu membuat aplikasi produksi dunia nyata end2end, dengan cepat .
dotnet new install Uno.Templates
dotnet new install Modern.CSharp.Templates
md UnoCSharpMarkup2
cd UnoCSharpMarkup2
dotnet new unoapp -preset recommended
dotnet new mcs-uno-markup2 --presentation mvux --allow-scripts yes
Platform Uno mendukung XAML tetapi baru-baru ini telah menggunakan C# UI juga dengan Markup Uno C#. C# Markup 2 menambahkan opsi lain yang melampaui apa yang ditawarkan varian C# Markup gen-1.
Ada baiknya jika kita mempunyai pilihan - semua orang menang: pengembang mendapatkan pengalaman yang paling mereka sukai, dan kerangka UI mendapatkan lebih banyak adopsi. Lihatlah dan pilih yang Anda suka!
Sebagai kesan pertama, berikut perbandingan singkatnya:
Nikmati pengalaman pengembangan UI seperti Flutter dengan C# Markup 2:
new
, HorizontalAlignment = HorizontalAlignment.Center
, () =>
atau nameof()
yang tak ada habisnya, tidak perlu lagi menentukan untuk setiap pengikatan TextBlock
yang ya, Anda ingin mengikat ke properti Text
...MyPage.cs
, lihat kerangka UI dan API lainnya saat mengedit MyPage.logic.cs
.Tidak diperlukan XAML/HTML/JavaScript/CSS. Tidak ada mesin atau lapisan yang menghalangi Anda.
NuGet
Ngobrol (kalau perlu, gabung DotNetEvolution dulu)
Tempat terbaik untuk bertanya atau membantu!
Mencari C# Markup 1? Temukan di sini
7 Mei 2024
C# Markup 2.4 baru untuk Uno Platform 5.2 termasuk .NET Single Project
Rilis hari ini sepenuhnya diperbarui ke Diperbarui ke Uno 5.2 termasuk Proyek Tunggal .NET Uno dan uno.sdk
!
Plus:
dotnet new unoapp
terbaru21 Desember 2023
Templat C# Markup 2 baru untuk Uno Platform 5
Selain beberapa metode C# Markup 2 baru, rilis hari ini menambahkan dukungan untuk templat C# Markup 2 baru untuk Uno Platform 5: templat mcs-uno-markup2
yang diperbarui, dan templat mcs-uno-view
baru.
dotnet new unoapp
Uno atau dengan wizard solusi Uno untuk Visual Studiomcs-uno-view
baru digunakan oleh skrip New-View.ps1
yang mudah digunakan, yang disertakan dalam mcs-uno-markup2
18 November 2023
Rilis 2.3 adalah GA - menambahkan dukungan untuk .NET 8, Uno 5 plus 5 Pustaka Uno!
Rilis ini sepenuhnya diperbarui ke rilis Uno 5 dan .NET 8 GA yang mengagumkan. Anda dapat menggunakan Uno Solution Wizard untuk Visual Studio dan menambahkan proyek C# Markup 2 ke dalamnya kapan saja dengan satu perintah. Semua penyesuaian wizard Uno didukung: gabungkan C# Markup 2 dengan MVUX atau MVVM, XAML atau Uno C# Markup, gunakan ekstensi Navigasi Uno, dan targetkan .NET 8 atau .NET 7. Semua platform target Uno didukung.
Templat proyek C# Markup 2 dotnet baru membuat Anda siap bekerja dalam waktu singkat - dioptimalkan dengan cermat untuk pengalaman pengembang yang optimal: tampilan penjelajah solusi yang rapi, pengelompokan file otomatis dari file markup dan logika, sumber markup yang rapi, intellisense yang terfokus, titik awal yang jelas untuk ekstensi markup dalam kode Anda, ditambah hot reload cepat - baik otomatis maupun dengan overlay tombol hot reload dalam mode debug, untuk platform yang IDE Anda dapat hot reload tetapi (belum) dapat memperbarui UI secara otomatis.
Nikmati penyempurnaan umum C# Markup 2, ditambah API C# Markup 2 untuk 5 pustaka Uno tambahan:
ThemeResource
dapat dicari dalam C# intellisense, diketik dengan kuatPermulaannya sepenuhnya terkini. Contoh dalam repo ini dan readme ini akan segera diperbarui untuk menampilkan fitur-fitur baru.
NJoy markup C# yang ringkas !
1 November 2023
2.3 Rilis Pratinjau menambahkan 5 Perpustakaan Uno!
Nikmati penyempurnaan umum C# Markup 2, ditambah API C# Markup 2 untuk 5 pustaka Uno tambahan:
ThemeResource
dapat dicari dalam C# intellisense, diketik dengan kuatAnda dapat mencobanya hari ini - lihat NuGets yang tercantum di atas. Dokumentasi fitur-fitur baru ditambah panduan memulai baru akan hadir pada rilis berikutnya - segera!
27 Juni 2023
2.2 Rilis & dimulainya dukungan .NET MAUI
25 Maret 2023
Hasil polling sudah masuk! Dan pemenangnya adalah...
Hasil jajak pendapat bulan Maret 2023 tentang apa yang harus dibangun selanjutnya untuk C# Markup 2 sudah tersedia!
Tambahan yang mengejutkan adalah permintaan C# Markup 2 untuk Avalonia UI di balasannya; mendapat respon besar yang melambungkannya ke posisi ke-2 yang sangat dekat.
Berikut adalah hasil jajak pendapat termasuk pilihan "Lainnya" Blazor dan AvaloniaUI:
Dan pemenangnya adalah: C# Markup 2 untuk MAUI !
Tonton dan bintangi repo ini untuk menyaksikan rilisnya; Anda juga dapat menonton tweet #CSharpForMarkup untuk mengetahui kemajuannya. Terima kasih atas tanggapan Anda!
28 Februari 2023
Rilis Utama - C# Markup 2 versi 2.0 untuk WinUI 3!
C# Markup 2 versi 2.0 untuk WinUI 3 telah hadir! Sepenuhnya diperbarui ke .NET 7, C# 11 dan Windows App SDK dan Platform Uno terbaru. Dengan banyak perbaikan termasuk 6 platform target yang didukung, dukungan hot reload C# dan templat proyek baru dotnet.
Dipersembahkan oleh Applicita
Terima kasih khusus ditujukan kepada Applicita yang telah memungkinkan rilis ini; sungguh menginspirasi melihat perusahaan mendukung OSS dengan cara ini (Applicita juga membuat beberapa perpustakaan berguna lainnya menjadi sumber terbuka)
Lebih lanjut tentang apa yang baru dalam rilis ini di sini.
16 Februari 2023
Rilis baru C# Markup 2 untuk WinUI 3 dan Uno Platform akan hadir pada Februari 2023
Diperbarui ke .NET 7, C# 11 dan Windows App SDK dan Platform Uno terbaru. Dengan banyak perbaikan - termasuk dukungan hot reload C# dan template proyek baru dotnet. Perhatikan ruang ini!
14 April 2022
Rilis 0.8 baru: menambahkan dukungan
ControlTemplate
dan peningkatanStyle
!
Lihat di sini dan di sini untuk daftar lengkap perbaikan
15 Februari 2022
Rilis 0.6 baru: menambahkan WPF dan banyak perbaikan!
Lihat di sini untuk daftar lengkap perbaikan
30 November 2021
C# Markup 2 diumumkan di UNOCONF 2021!
Pratinjau pertama ini menargetkan Platform WinUI 3 dan Uno - termasuk perakitan web browser - dengan C# 10 dan .NET 6. Ini mendukung .NET Hot Reload untuk loop dev dalam yang cepat.
Lihat pengumuman C# Markup 2 di UNOCONF 2021:
Build()
, Assign()
dan Invoke()
.Pertama periksa apakah lingkungan pengembangan Anda sudah siap:
Pilih solusi Uno Platform 5.2 yang sudah ada, atau buat yang baru dengan Uno Platform Template Wizard atau templat dotnet new unoapp. Jangan ragu untuk memilih opsi apa pun; C# Markup 2 sepenuhnya mendukung Uno 5.2 dengan .NET 8 atau .NET 7, MVUX atau MVVM, XAML atau Uno C# Markup, di semua platform target.
Instal Modern.CSharp.Templates terbaru untuk dotnet new
untuk mendapatkan template ini untuk Windows App SDK, Platform Uno, dan banyak lagi
dotnet new install Modern.CSharp.Templates
Untuk melihat bantuan tentang parameter templat:
dotnet new mcs-uno-markup2 -h
Tambahkan proyek C# Markup 2 ke solusi Uno Platform, misalnya:
cd C:ReposUnoApp1
dotnet new mcs-uno-markup2 --appRootNamespace InnoWvate.UnoApp1 --presentation mvux --allow-scripts Yes
Ini akan:
Tambahkan proyek baru UnoApp1.Presentation
ke solusinya, dengan contoh kerja:
New-View.ps1
untuk menambahkan lebih banyak halaman dan model dengan cepatReadme.md
dengan petunjuk tentang cara memulai dengan cepatProyek Presentasi telah terstruktur sebelumnya agar mudah dirawat sesuai dengan praktik terbaik untuk C# Markup UI
Tambahkan referensi paket NuGet ke proyek Presentasi
Tambahkan referensi ke proyek Presentasi di proyek UnoApp1
Perhatikan bahwa Anda dapat menggunakan parameter --name
dari dotnet new
untuk menentukan nama proyek Uno Anda yang ada , jika itu berbeda dari nama folder solusi (dalam contoh di atas, UnoApp1
). Nama yang ditentukan juga akan digunakan dengan akhiran .Presentation
untuk proyek baru.
Buka atau muat ulang solusi Uno dan ikuti langkah-langkah di Readme.md
proyek Presentasi untuk memulai.
Untuk mempelajari cara menggunakan C# Markup 2, baca deskripsi fitur di bawah.
Untuk contoh lebih lengkap, lihat contoh aplikasi di repo ini.
C# Markup 2 berisi API deklaratif penuh dan lancar untuk kerangka UI yang ada. Ini menampilkan hampir semua tata letak, tampilan, dan properti, termasuk properti terlampir, dan menyertakan dokumentasi sebaris lengkap yang menghubungkan setiap pembantu markup/parameter ke dokumentasi sebaris untuk objek/properti UI yang mendasarinya.
Kerangka kerja UI kaya yang permukaan C# Markup 2 dapat berisi hingga 500+ tipe objek UI . Misalnya tata letak, tampilan dan gaya, tetapi juga kuas, elemen teks kaya, gambar primitif, transformasi, animasi, status visual, dan banyak lagi. Selain itu C# Markup menawarkan API kenyamanan yang kuat dan ringkas untuk tata letak, pengikatan, konverter, templat, dan banyak lagi.
Tata letak, tampilan, properti, dan nilai properti terlihat seperti ini:
Semua properti dapat diatur dengan metode ekstensi: properti yang ditentukan pada tipe tampilan atau tipe dasarnya, serta properti terlampir.
Properti yang didefinisikan secara langsung pada tipe tampilan dapat diatur dengan parameter bernama:
Ini terutama berguna untuk properti yang menggunakan tipe primitif.
Properti yang mengambil nilai enum memiliki metode ekstensi sehingga nama enum tidak perlu diulang
(seperti dalam TextAlignment: TextAlignment.Center
):
Nama properti terlampir diawali dengan tipe penentu ditambah garis bawah:
Anda dapat menyetel beberapa nilai properti terlampir untuk tipe definisi yang sama dalam satu panggilan :
Selain itu, ada kelebihan kenyamanan untuk beberapa tipe tampilan hanya dengan parameter yang paling umum digunakan:
Konverter implisit disediakan di subnamespace to
untuk tipe nilai properti umum:
Ini adalah:
string
, seperti yang ditentukan oleh kerangka UI dengan atribut TypeConverterstring
, termasuk tupel jika diharapkan lebih dari satu nilai. Misalnya: Button() .CornerRadius (2.5)
atauButton() .CornerRadius ((2.5, 0, 2.5, 0))
Contoh penggunaan to.Point
:
Button ( ) . Background ( RadialGradientBrush ( Center : ( 50 , 50 ) , GradientOrigin : ( 100 , 50 ) ) )
Contoh penggunaan to.TimeSpan
dan to.Duration
:
ColorAnimation ( BeginTime : " 0:0:5 " , Duration : 2.5 )
Dalam banyak kasus, dokumentasi inline di to.
type menjelaskan nilai dan format yang didukung; khusus untuk string ini dapat menghindari dugaan.
Gaya dapat ditetapkan seperti ini:
Dan didefinisikan seperti ini:
Di WPF Anda dapat mengikat nilai penyetel gaya (WinUI 3 tidak mendukung ini):
DataTemplate
diteruskan sebagai Func
:
ControlTemplate
dapat dibuat seperti ini:
.BindTemplate()
memungkinkan Anda mengikat properti templat ke induk templattargetType
bersifat opsionalb
di sini adalah bidang static UI_Button
bernilai nol. Dalam contoh ini, ini hanya berfungsi untuk mendemonstrasikan satu cara untuk mendapatkan intellisense saat mengedit ekspresi pengikatan untuk Button
; lihat Kekuatan mengikat untuk detailnya. Inilah cara Anda menggunakan ControlTemplate
dalam Style
implisit atau eksplisit :
Anda dapat menggunakan enum sebagai pengganti angka untuk baris dan kolom Grid. Hal ini meningkatkan keterbacaan dan menyelamatkan Anda dari penomoran ulang baris dan kolom secara manual saat menambahkan/menghapus/mengurutkan ulangnya
Pembantu singkatan disertakan sebagai alternatif dari kombinasi umum pembantu markup:
Semua tata letak mengabaikan nilai null
pada children
; ini memungkinkan untuk memiliki tampilan bersyarat bergantung pada nilai ekspresi pada waktu pembuatan halaman (ulang).
Pembantu Spread
memungkinkan untuk memasukkan sejumlah variabel anak pada posisi tertentu dalam daftar children
(mirip dengan yang ditawarkan Flutter).
Berkat atribut CallerArgumentExpression C# 10, Anda tidak perlu menggunakan string atau nameof()
untuk menentukan jalur pengikatan dengan kinerja yang baik . Sebagai gantinya, Anda dapat menggunakan ekspresi C# dan menikmati semua kebaikan yang dibawanya: kecerdasan penuh, kompiler diperiksa, penggantian nama support :
Perhatikan dari deskripsi intellisense pada gambar di atas bahwa parameter pathExpression
mendukung beberapa sintaksis pengikatan yang mudah digunakan , yang memungkinkan untuk:
viewmodel.path
|| (viewmodel expression).path
, di mana path
dapat berisi .
misalnya:.Bind (vm.SelectedTweet)
mengikat ke "SelectedTweet".Bind ((vm.SelectedTweet).Title)
mengikat ke "Judul".Bind ((vm.SelectedTweet).Author.Name)
mengikat ke "Author.Name"?
dengan instance tipe bernilai nol untuk menikmati kebaikan C# tanpa memerlukan instance objek, misalnya:.Bind (vm?.SelectedTweet?.Title)
mengikat ke "Judul"?
dapat diperlukan karena ekspresi akan dievaluasi pada saat runtime, meskipun kita tidak peduli dengan nilainya; atribut CallerArgumentExpression menyediakan string ekspresi selain nilai ekspresi..Bind ("SelectedTweet")
mengikat ke "SelectedTweet" Karakter "
, @
, atau spasi apa pun di sekitar pathExpression
akan diabaikan
Bind
mendukung hampir semua fungsi yang ditawarkan kerangka UI untuk pengikatan. Selain itu, ada banyak kelebihan Bind
yang memungkinkan untuk:
Halaman markup tipikal dimulai seperti ini:
FlutterPage.cs
:
using CSharpMarkup . < UI framework name > ;
using static CSharpMarkup . < UI framework name > . Helpers ;
namespace Examples ;
partial class FlutterPage
{
public void Build ( ) => Content =
Perhatikan penggunaan partial class
; ini memungkinkan Anda memisahkan markup UI dari logika UI :
FlutterPage.logic.cs
:
using < UI framework namespace > . Controls ;
namespace Examples ;
public sealed partial class FlutterPage : Page , IBuild
{
readonly FlutterViewModel vm ;
public FlutterPage ( )
{
InitializeComponent ( ) ; // Only needed for WinUI
DataContext = vm = < obtain viewmodel instance > ;
Build ( ) ;
PENTING:
Dalam file markup C# seperti
:
Sertakan penggunaan namespace CSharpMarkup.*
tetapi tidak ada penggunaan model objek UI seperti using Microsoft.UI.Xaml;
(secara desain, nama tipe di namespace CSharpMarkup identik dengan nama tipe di model objek UI, jadi memasukkan keduanya akan menyebabkan ambiguitas)
Cobalah untuk membatasi penggunaan model objek UI pada file logika UI. Jika harus, Anda dapat menggunakan model objek UI dengan aman di file markup C#; praktik yang baik adalah mendefinisikan namespace global menggunakan alias, misalnya global using UI = Microsoft.UI;
Untuk panduan lebih lanjut, lihat komentar di GlobalUsings.cs
dari proyek yang dibuat dengan dotnet new mcs-uno-markup2
.
Dalam file logika UI seperti
:
Jangan gunakan objek CSharpMarkup
Instance objek markup tidak aman untuk digunakan di luar ekspresi markup (karena fitur performa - setiap jenis objek markup memiliki satu instance statis untuk mencegah pengalokasian objek tambahan untuk setiap tampilan). Itulah sebabnya Assign
dan Invoke
(lihat di bawah) meneruskan objek UI yang terdapat dalam objek markup ke logika, bukan objek markup itu sendiri.
Dengan Assign
and Invoke
Anda dapat mengintegrasikan markup UI dengan logika UI:
SearchPage.cs
:
SearchPage.logic.cs
:
SearchPage.cs
:
SearchPage.logic.cs
:
Catatan :
DiSearchPage.cs
,StackPanel
danTextBox
adalah tipe objek markup , sedangkan
diSearchPage.logic.cs
mereka adalah tipe objek kerangka UI yang sesuai
Tidak ada ekstensi C# Markup IDE (belum...) untuk mewarnai markup dengan benar, namun keterbacaan C# Markup dapat ditingkatkan dengan solusi ini dalam opsi Visual Studio:
Di bawah Fonts and Colors
, salin warna User Types - Classes
ke User Members - Methods
(dengan tombol Custom...
). Sekarang warna markup untuk tampilan dan properti tidak lagi sama.