Kontrolki dla aplikacji Windows

Kontrolki to elementy interfejsu użytkownika, które tworzą aplikację Windows — przyciski, pola tekstowe, listy, selektory i inne. Kontrolka wyświetla zawartość lub umożliwia użytkownikom interakcję z aplikacją. Wzorzec łączy wiele kontrolek w przepis wielokrotnego użytku dla typowych scenariuszy, takich jak formularze lub układy szczegółów listy.

Windows oferuje ponad 45 gotowych do użycia kontrolek, które są oparte na systemie projektowania Fluent. Od prostych przełączników do zaawansowanych widoków danych, takich jak siatka i lista, te kontrolki ułatwiają tworzenie interfejsów, które są wizualnie dopracowane, dostępne i dynamiczne na różnych urządzeniach.

Przejrzyj artykuły w tej sekcji, aby uzyskać wskazówki dotyczące projektowania, przykłady kodu i najlepsze rozwiązania dotyczące każdej kontrolki i wzorca.

Rozpoczęcie pracy

Aby dowiedzieć się, jak dodawać kontrolki do aplikacji i podłączać programy obsługi zdarzeń, zobacz Dodawanie kontrolek i obsługa zdarzeń. Aby dostosować wygląd kontrolki za pomocą stylów XAML wielokrotnego użytku, zobacz Kontrolki stylów.

Sterowanie

W poniższej tabeli wymieniono kontrolki aplikacji Windows dostępne w usłudze WinUI z linkami do ich dokumentacji.

Podstawowe dane wejściowe

obraz	Kontrola	Opis
	Przyciski	Kontrolka odpowiadająca na dane wejściowe użytkownika i zgłasza zdarzenie Kliknięcia. Zawiera przycisk, przycisk listy rozwijanej, przycisk podziału, przycisk przełącznika i nie tylko.
	Pola wyboru	Kontrolka, którą użytkownik może wybrać lub wyczyścić.
	Pola kombinowane	Lista rozwijana elementów, z których użytkownik może wybrać.
	Hiperłącza	Przycisk, który wyświetla się jako tekst hiperłącza i może prowadzić do adresu URI lub obsługiwać zdarzenie kliknięcia.
	przyciski radiowe	Kontrolka, która umożliwia użytkownikowi wybranie pojedynczej opcji z grupy opcji.
	Kontrolka klasyfikacji	Oceń coś od 1 do 5 gwiazdek.
	Suwaki	Kontrolka, która umożliwia użytkownikowi wybranie z zakresu wartości przez przeniesienie kontrolki Thumb wzdłuż ścieżki.
	przełączniki dźwigniowe	Przełącznik, który można przełączać między 2 stanami.

Collections

obraz	Kontrola	Opis
	Widok elementów	Kontrolka, która przedstawia kolekcję elementów przy użyciu różnych układów.
	widok listy i widok siatki	Kontrolki, które przedstawiają kolekcję elementów na liście pionowej lub w wierszach i kolumnach.
	przełączanie widoku	Przedstawia kolekcję elementów, które użytkownik może przerzucać, jeden element naraz.
	Pips pager	Kontrolka zezwalania użytkownikowi na nawigowanie po kolekcji podzielonej na strony, gdy numery stron nie muszą być wizualnie znane.
	Widok drzewa	Wzorzec hierarchicznej listy z węzłami, które można rozwijać i zwijać, zawierającymi zagnieżdżone elementy.
	Powielacz elementów	Elastyczna, pierwotna kontrolka układów opartych na danych.
	Przesuń palcem	Gest dotykowy umożliwiający szybkie akcje w menu elementów.
	Przeciągnij, aby odświeżyć	Umożliwia ściąganie kolekcji elementów na liście/siatce w celu odświeżenia zawartości kolekcji.

Okna dialogowe i menu rozwijane

obraz	Kontrola	Opis
	Okna dialogowe	Okno dialogowe, które można dostosować tak, aby zawierało dowolną zawartość XAML.
	Wysuwane	Wyświetla informacje kontekstowe i umożliwia interakcję z użytkownikiem.
	Porada dydaktyczna	Bogaty w treści wysuwany panel do prowadzenia użytkowników i tworzenia okazji do nauki.

Formularze

obraz	Kontrola	Opis
	Formularze	Wzorzec zbierania i przesyłania danych wejściowych użytkownika przy użyciu kombinacji kontrolek wejściowych i etykiet.

Multimedia, grafika i kształty

obraz	Kontrola	Opis
	Ikony	Reprezentuje kontrolki ikon, które używają różnych typów obrazów jako zawartości.
	Ikony animowane	Element, który wyświetla i kontroluje ikonę, która animuje się, gdy użytkownik wchodzi w interakcję z kontrolką.
	Obrazy i pędzle do obrazów	Kontrolka do wyświetlania zawartości obrazu.
	Atramentu	Kontrolki do cyfrowego pisma, w tym płótno pisma cyfrowego i pasek narzędzi do pisma cyfrowego.
	odtwarzania multimediów	Kontrolka do wyświetlania zawartości wideo i obrazu.
	kształty	Rysuj kształty, takie jak wielokropki, prostokąty i wielokąty.

Menu i paski narzędzi

obraz	Kontrola	Opis
	Menu i menu kontekstowe	Przedstawia kontekstową listę prostych poleceń lub opcji.
	Pasek poleceń	Pasek narzędzi do wyświetlania poleceń specyficznych dla aplikacji, które obsługują układ i zmianę rozmiaru jego zawartości.
	Pasek poleceń — menu rozwijane	Mini-pasek narzędzi wyświetlający proaktywne polecenia i opcjonalne menu poleceń.
	menu wysuwane i pasek menu	Menu klasyczne umożliwiające wyświetlanie elementów MenuItem, które zawierają MenuFlyoutItems.

Navigation

obraz	Kontrola	Opis
	Pasek nawigacyjny śladowy	Pokazuje ślad nawigacji prowadzący do bieżącej lokalizacji.
	lista/szczegóły	Wzorzec, który wyświetla listę elementów wraz ze szczegółami aktualnie wybranego elementu.
	Widok nawigacji	Typowy układ pionowy dla obszarów najwyższego poziomu aplikacji za pośrednictwem zwijanego menu nawigacji.
	Oś	Przedstawia informacje z różnych źródeł w widoku z kartami.
	Pasek selektora	Przedstawia informacje z małego zestawu różnych źródeł. Użytkownik może wybrać jeden z nich.
	Widok zakładek	Kontrolka, która wyświetla kolekcję kart, których można użyć do wyświetlania kilku dokumentów.

People

obraz	Kontrola	Opis
	Obraz osoby	Wyświetla obraz osoby/kontaktu.

Pickers

obraz	Kontrola	Opis
	Selektor kolorów	Kontrolka, która wyświetla możliwe do wyboru spektrum kolorów.
	Wybieracz daty z kalendarza	Kontrolka, która umożliwia użytkownikom wybranie wartości daty przy użyciu kalendarza.
	widok kalendarza	Kontrolka, która przedstawia kalendarz dla użytkownika, z którego ma wybrać datę.
	Wybór daty	Kontrolka, która umożliwia użytkownikowi wybranie wartości daty.
	Selektor czasu	Konfigurowalna kontrolka umożliwiająca użytkownikowi wybranie wartości czasu.

Przewijanie i układ

obraz	Kontrola	Opis
	Expander	Kontener z nagłówkiem, który można rozwinąć, aby wyświetlić treść z większą zawartością.
	Przewijanie i przesuwanie kontrolek	Kontrolka kontenera, która umożliwia użytkownikowi przesuwanie i powiększanie jego zawartości.
	Pasek przewijania z adnotacjami	Kontrolka, która rozszerza funkcję zwykłego pionowego paska przewijania w celu łatwego nawigowanie po dużych kolekcjach.
	przybliżanie semantyczne	Umożliwia użytkownikowi powiększenie między dwoma różnymi widokami kolekcji, co ułatwia przechodzenie przez duże kolekcje elementów.
	widok podzielony	Kontener zawierający 2 obszary zawartości z wieloma opcjami wyświetlania okienka.
	Widok z dwoma okienkami	Kontrolka z dwoma obszarami zawartości, które obejmują dostępne miejsce, obok siebie lub jeden nad drugim.

Stan i informacje

obraz	Kontrola	Opis
	Progress	Pokazuje postęp aplikacji w zadaniu przy użyciu paska postępu lub pierścienia postępu.
	etykietka narzędzia	Wyświetla informacje o elemencie w oknie podręcznym.
	Pasek informacji	Komunikat wbudowany do wyświetlania informacji o zmianie stanu całej aplikacji.
	Znaczek informacyjny	Nieinwazyjny interfejs użytkownika do wyświetlania powiadomień lub skupiania się na obszarze.

Tekst

obraz	Kontrola	Opis
	pole automatycznych sugestii	Kontrolka, która umożliwia podanie sugestii w miarę wpisywania przez użytkownika.
	blok tekstu	Uproszczona kontrolka do wyświetlania małych ilości tekstu.
	Blok tekstu sformatowanego	Kontrolka wyświetlająca sformatowany tekst, hiperlinki, obrazy wbudowane i inną zawartość sformatowaną.
	pole tekstowe	Jednowierszowe lub wielowierszowe pole zwykłego tekstu.
	rozszerzone pole edycji	Kontrolka edycji tekstu sformatowanego, która obsługuje sformatowany tekst, hiperlinki i inną zawartość sformatowaną.
	pole hasła	Kontrolka wprowadzania haseł.
	Pole liczbowe	Kontrolka tekstu używana do wprowadzania liczbowego i obliczania równań algebraicznych.
	Etykiety	Wskazówki dotyczące dodawania etykiet dostępnych do kontrolek wejściowych.

Pasek tytułowy

obraz	Kontrola	Opis
	Pasek tytułu	Dostosuj pasek tytułu okna aplikacji.

Galeria WinUI 3

Aplikacja Galeria WinUI 3 to najlepszy sposób na praktyczne zapoznanie się z tymi kontrolkami. Udostępnia interaktywne demonstracje większości kontrolek, funkcji i wzorców Fluent Design, co czyni go idealnym uzupełnieniem niniejszej dokumentacji. Zainstaluj to, aby wypróbować elementy sterujące w czasie rzeczywistym i połączyć się bezpośrednio z poszczególnych stron elementów sterujących.

• Pobierz galerię WinUI 3 ze Sklepu Microsoft.
• Pobierz kod źródłowy z GitHub.

Dodatkowe kontrolki i zasoby

Zestaw narzędzi Windows Community Toolkit to zbiór pomocników, rozszerzeń i dodatkowych kontrolek interfejsu użytkownika, które uzupełniają wbudowane kontrolki WinUI. Jest on oparty na społeczności i obsługiwany przez firmę Microsoft, obejmujący typowe scenariusze, takie jak zaawansowane układy, konwertery i animacje.

Aby uzyskać wczesny dostęp do eksperymentalnych kontrolek i funkcji, zapoznaj się z Windows Community Toolkit Labs, gdzie nowe składniki są opracowywane i testowane przed ukończeniem głównego zestawu narzędzi.