Kontrolki
Interfejs użytkownika aplikacji wieloplatformowej platformy .NET (.NET MAUI) jest skonstruowany z obiektów mapowanych na natywne kontrolki każdej platformy docelowej.
Główne grupy sterowania używane do tworzenia interfejsu użytkownika aplikacji .NET MAUI to strony, układy i widoki. Strona .NET MAUI zazwyczaj zajmuje pełny ekran lub okno. Strona zwykle zawiera układ, który zawiera widoki i ewentualnie inne układy. Strony, układy i widoki pochodzą z VisualElement klasy . Ta klasa udostępnia różne właściwości, metody i zdarzenia, które są przydatne w klasach pochodnych.
Uwaga
ListView a TableView także obsługiwać użycie komórek. Komórki są wyspecjalizowanymi elementami używanymi dla elementów w tabeli, które opisują sposób renderowania każdego elementu.
Strony
Aplikacje .NET MAUI składają się z co najmniej jednej strony. Strona zwykle zajmuje cały ekran lub okno, a każda strona zazwyczaj zawiera co najmniej jeden układ.
Program .NET MAUI zawiera następujące strony:
Strona | opis |
---|---|
ContentPage | ContentPage wyświetla jeden widok i jest najczęściej spotykanym typem strony. Aby uzyskać więcej informacji, zobacz ContentPage. |
FlyoutPage | FlyoutPage to strona, która zarządza dwiema powiązanymi stronami informacji — stroną wysuwaną zawierającą elementy i stroną szczegółów zawierającą szczegółowe informacje o elementach na stronie wysuwanej. Aby uzyskać więcej informacji, zobacz FlyoutPage. |
NavigationPage | NavigationPage Zapewnia hierarchiczne środowisko nawigacji, w którym można poruszać się po stronach, do przodu i do tyłu zgodnie z potrzebami. Aby uzyskać więcej informacji, zobacz NavigationPage. |
TabbedPage | TabbedPage składa się z serii stron, które można nawigowalne według kart w górnej lub dolnej części strony, z każdą kartą ładującą zawartość strony. Aby uzyskać więcej informacji, zobacz TabbedPage. |
Układy
Układy .NET MAUI służą do tworzenia kontrolek interfejsu użytkownika w strukturach wizualnych, a każdy układ zwykle zawiera wiele widoków. Klasy układu zwykle zawierają logikę ustawiania położenia i rozmiaru elementów podrzędnych.
Program .NET MAUI zawiera następujące układy:
Układ | opis |
---|---|
AbsoluteLayout | AbsoluteLayout pozycje elementów podrzędnych w określonych lokalizacjach względem jego elementu nadrzędnego. Aby uzyskać więcej informacji, zobacz AbsoluteLayout. |
BindableLayout | BindableLayout umożliwia każdej klasie układu generowanie zawartości przez powiązanie z kolekcją elementów z opcją ustawiania wyglądu każdego elementu. Aby uzyskać więcej informacji, zobacz BindableLayout. |
FlexLayout | FlexLayout umożliwia stosowi lub opakowaniu elementów podrzędnych z różnymi opcjami wyrównania i orientacji. FlexLayout jest oparty na module elastycznego układu ramek CSS, nazywanym układem flex lub flex-box. Aby uzyskać więcej informacji, zobacz FlexLayout. |
Grid | Grid umieszcza elementy podrzędne w siatce wierszy i kolumn. Aby uzyskać więcej informacji, zobacz Siatka. |
HorizontalStackLayout | HorizontalStackLayout pozycje elementów podrzędnych w stosie poziomym. Aby uzyskać więcej informacji, zobacz HorizontalStackLayout. |
StackLayout | StackLayout umieszcza elementy podrzędne w stosie pionowym lub poziomym. Aby uzyskać więcej informacji, zobacz StackLayout. |
VerticalStackLayout | VerticalStackLayout pozycje elementów podrzędnych w stosie pionowym. Aby uzyskać więcej informacji, zobacz VerticalStackLayout. |
Widoki
Widoki maUI platformy .NET to obiekty interfejsu użytkownika, takie jak etykiety, przyciski i suwaki, które są powszechnie znane jako kontrolki lub widżety w innych środowiskach.
Program .NET MAUI zawiera następujące widoki:
Wyświetlanie | opis |
---|---|
ActivityIndicator | ActivityIndicator używa animacji, aby pokazać, że aplikacja jest zaangażowana w długotrwałe działanie bez wskazania postępu. Aby uzyskać więcej informacji, zobacz ActivityIndicator. |
BlazorWebView | BlazorWebView Umożliwia hostowanie aplikacji internetowej platformy Blazor w aplikacji .NET MAUI. Aby uzyskać więcej informacji, zobacz BlazorWebView. |
Border | Border to kontrolka kontenera, która rysuje obramowanie, tło lub oba elementy wokół innej kontrolki. Aby uzyskać więcej informacji, zobacz Obramowanie. |
BoxView | BoxView rysuje prostokąt lub kwadrat o określonej szerokości, wysokości i kolorze. Aby uzyskać więcej informacji, zobacz BoxView. |
Button | Button Wyświetla tekst i odpowiada na naciśnięcie lub kliknięcie, które przekierowuje aplikację do wykonania zadania. Aby uzyskać więcej informacji, zobacz Przycisk. |
CarouselView | CarouselView Wyświetla przewijaną listę elementów danych, w której użytkownicy szybko przesuwają się, aby przejść przez kolekcję. Aby uzyskać więcej informacji, zobacz CarouselView. |
CheckBox | CheckBox Umożliwia wybranie wartości logicznej przy użyciu typu przycisku, który można zaznaczyć lub opróżnić. Aby uzyskać więcej informacji, zobacz CheckBox. |
CollectionView | CollectionView Wyświetla przewijaną listę elementów danych możliwych do wyboru przy użyciu różnych specyfikacji układu. Aby uzyskać więcej informacji, zobacz CollectionView. |
ContentView | ContentView to kontrolka, która umożliwia tworzenie niestandardowych kontrolek wielokrotnego użytku. Aby uzyskać więcej informacji, zobacz ContentView. |
DatePicker | DatePicker Umożliwia wybranie daty z selektorem dat platformy. Aby uzyskać więcej informacji, zobacz DatePicker. |
Editor | Editor Umożliwia wprowadzanie i edytowanie wielu wierszy tekstu. Aby uzyskać więcej informacji, zobacz Edytor. |
Ellipse | Ellipse wyświetla wielokropek lub okrąg. Aby uzyskać więcej informacji, zobacz Elipsa. |
Entry | Entry Umożliwia wprowadzanie i edytowanie pojedynczego wiersza tekstu. Aby uzyskać więcej informacji, zobacz Wpis. |
Frame | Frame Służy do zawijania widoku lub układu z obramowaniem, które można skonfigurować za pomocą koloru, cienia i innych opcji. Aby uzyskać więcej informacji, zobacz Frame (Ramka). |
GraphicsView | GraphicsView to kanwa grafiki, na której można rysowania grafiki 2D przy użyciu typów z Microsoft.Maui.Graphics przestrzeni nazw. Aby uzyskać więcej informacji, zobacz GraphicsView. |
Image | Image wyświetla obraz, który można załadować z pliku lokalnego, identyfikatora URI, zasobu osadzonego lub strumienia. Aby uzyskać więcej informacji, zobacz Obraz. |
ImageButton | ImageButton wyświetla obraz i reaguje na naciśnięcie lub kliknięcie, które przekierowuje aplikację do wykonania zadania. Aby uzyskać więcej informacji, zobacz ImageButton. |
IndicatorView | IndicatorView wyświetla wskaźniki reprezentujące liczbę elementów w obiekcie CarouselView. Aby uzyskać więcej informacji, zobacz IndicatorView. |
Label | Label Wyświetla tekst jednowierszowy i wielowierszowy. Aby uzyskać więcej informacji, zobacz Etykieta. |
Line | Line wyświetla wiersz od punktu początkowego do punktu końcowego. Aby uzyskać więcej informacji, zobacz Wiersz. |
ListView | ListView Wyświetla przewijaną listę wybranych elementów danych. Aby uzyskać więcej informacji, zobacz ListView. |
Map | Map wyświetla mapę i wymaga zainstalowania pakietu NuGet Microsoft.Maui.Controls.Maps w aplikacji. |
Path | Path wyświetla krzywe i złożone kształty. Aby uzyskać więcej informacji, zobacz Ścieżka. |
Picker | Picker wyświetla krótką listę elementów, z których można wybrać element. Aby uzyskać więcej informacji, zobacz Selektor. |
Polygon | Polygon wyświetla wielokąt. Aby uzyskać więcej informacji, zobacz Wielokąt. |
Polyline | Polyline wyświetla serię połączonych linii prostych. Aby uzyskać więcej informacji, zobacz Polyline. |
ProgressBar | ProgressBar używa animacji, aby pokazać, że aplikacja przechodzi przez długotrwałe działanie. Aby uzyskać więcej informacji, zobacz ProgressBar. |
RadioButton | RadioButton to typ przycisku, który umożliwia wybór jednej opcji z zestawu. Aby uzyskać więcej informacji, zobacz RadioButton. |
Rectangle | Rectangle wyświetla prostokąt lub kwadrat. Aby uzyskać więcej informacji, zobacz Prostokąt. |
RefreshView | RefreshView to kontrolka kontenera, która zapewnia funkcję ściągania do odświeżania zawartości przewijanej. Aby uzyskać więcej informacji, zobacz RefreshView. |
RoundRectangle | RoundRectangle wyświetla prostokąt lub kwadrat z zaokrąglonymi rogami. Aby uzyskać więcej informacji, zobacz Prostokąt. |
ScrollView | ScrollView Zapewnia przewijanie jego zawartości, która jest zazwyczaj układem. Aby uzyskać więcej informacji, zobacz ScrollView. |
SearchBar | SearchBar to kontrolka danych wejściowych użytkownika używana do inicjowania wyszukiwania. Aby uzyskać więcej informacji, zobacz SearchBar. |
Slider | Slider Umożliwia wybranie double wartości z zakresu ciągłego. Aby uzyskać więcej informacji, zobacz Suwak. |
Stepper | Stepper Umożliwia wybranie double wartości z zakresu wartości przyrostowych. Aby uzyskać więcej informacji, zobacz Stepper. |
SwipeView | SwipeView to kontrolka kontenera, która opakowuje element zawartości i udostępnia elementy menu kontekstowego, które są ujawniane za pomocą gestu przesunięcia. Aby uzyskać więcej informacji, zobacz SwipeView. |
Switch | Switch Umożliwia wybranie wartości logicznej przy użyciu typu przycisku, który może być włączony lub wyłączony. Aby uzyskać więcej informacji, zobacz Przełączanie. |
TableView | TableView Wyświetla tabelę elementów przewijanych, które można zgrupować w sekcjach. Aby uzyskać więcej informacji, zobacz TableView. |
TimePicker | TimePicker umożliwia wybranie godziny z selektorem czasu platformy. Aby uzyskać więcej informacji, zobacz TimePicker. |
TwoPaneView | TwoPaneView reprezentuje kontener z dwoma widokami, które mają rozmiar i umieść ich zawartość w dostępnym miejscu— obok siebie lub u góry do dołu. Aby uzyskać więcej informacji, zobacz TwoPaneView. |
WebView | WebView wyświetla strony internetowe lub lokalną zawartość HTML. Aby uzyskać więcej informacji, zobacz WebView. |
Wyświetlanie | opis |
---|---|
ActivityIndicator | ActivityIndicator używa animacji, aby pokazać, że aplikacja jest zaangażowana w długotrwałe działanie bez wskazania postępu. Aby uzyskać więcej informacji, zobacz ActivityIndicator. |
BlazorWebView | BlazorWebView Umożliwia hostowanie aplikacji internetowej platformy Blazor w aplikacji .NET MAUI. Aby uzyskać więcej informacji, zobacz BlazorWebView. |
Border | Border to kontrolka kontenera, która rysuje obramowanie, tło lub oba elementy wokół innej kontrolki. Aby uzyskać więcej informacji, zobacz Obramowanie. |
BoxView | BoxView rysuje prostokąt lub kwadrat o określonej szerokości, wysokości i kolorze. Aby uzyskać więcej informacji, zobacz BoxView. |
Button | Button Wyświetla tekst i odpowiada na naciśnięcie lub kliknięcie, które przekierowuje aplikację do wykonania zadania. Aby uzyskać więcej informacji, zobacz Przycisk. |
CarouselView | CarouselView Wyświetla przewijaną listę elementów danych, w której użytkownicy szybko przesuwają się, aby przejść przez kolekcję. Aby uzyskać więcej informacji, zobacz CarouselView. |
CheckBox | CheckBox Umożliwia wybranie wartości logicznej przy użyciu typu przycisku, który można zaznaczyć lub opróżnić. Aby uzyskać więcej informacji, zobacz CheckBox. |
CollectionView | CollectionView Wyświetla przewijaną listę elementów danych możliwych do wyboru przy użyciu różnych specyfikacji układu. Aby uzyskać więcej informacji, zobacz CollectionView. |
ContentView | ContentView to kontrolka, która umożliwia tworzenie niestandardowych kontrolek wielokrotnego użytku. Aby uzyskać więcej informacji, zobacz ContentView. |
DatePicker | DatePicker Umożliwia wybranie daty z selektorem dat platformy. Aby uzyskać więcej informacji, zobacz DatePicker. |
Editor | Editor Umożliwia wprowadzanie i edytowanie wielu wierszy tekstu. Aby uzyskać więcej informacji, zobacz Edytor. |
Ellipse | Ellipse wyświetla wielokropek lub okrąg. Aby uzyskać więcej informacji, zobacz Elipsa. |
Entry | Entry Umożliwia wprowadzanie i edytowanie pojedynczego wiersza tekstu. Aby uzyskać więcej informacji, zobacz Wpis. |
Frame | Frame Służy do zawijania widoku lub układu z obramowaniem, które można skonfigurować za pomocą koloru, cienia i innych opcji. Aby uzyskać więcej informacji, zobacz Frame (Ramka). |
GraphicsView | GraphicsView to kanwa grafiki, na której można rysowania grafiki 2D przy użyciu typów z Microsoft.Maui.Graphics przestrzeni nazw. Aby uzyskać więcej informacji, zobacz GraphicsView. |
HybridWebView | HybridWebView Umożliwia hostowanie dowolnej zawartości HTML/JS/CSS w widoku internetowym i umożliwia komunikację między kodem w widoku internetowym (JavaScript) i kodem hostujący widok internetowy (C#/.NET). Aby uzyskać więcej informacji, zobacz HybridWebView. |
Image | Image wyświetla obraz, który można załadować z pliku lokalnego, identyfikatora URI, zasobu osadzonego lub strumienia. Aby uzyskać więcej informacji, zobacz Obraz. |
ImageButton | ImageButton wyświetla obraz i reaguje na naciśnięcie lub kliknięcie, które przekierowuje aplikację do wykonania zadania. Aby uzyskać więcej informacji, zobacz ImageButton. |
IndicatorView | IndicatorView wyświetla wskaźniki reprezentujące liczbę elementów w obiekcie CarouselView. Aby uzyskać więcej informacji, zobacz IndicatorView. |
Label | Label Wyświetla tekst jednowierszowy i wielowierszowy. Aby uzyskać więcej informacji, zobacz Etykieta. |
Line | Line wyświetla wiersz od punktu początkowego do punktu końcowego. Aby uzyskać więcej informacji, zobacz Wiersz. |
ListView | ListView Wyświetla przewijaną listę wybranych elementów danych. Aby uzyskać więcej informacji, zobacz ListView. |
Map | Map wyświetla mapę i wymaga zainstalowania pakietu NuGet Microsoft.Maui.Controls.Maps w aplikacji. |
Path | Path wyświetla krzywe i złożone kształty. Aby uzyskać więcej informacji, zobacz Ścieżka. |
Picker | Picker wyświetla krótką listę elementów, z których można wybrać element. Aby uzyskać więcej informacji, zobacz Selektor. |
Polygon | Polygon wyświetla wielokąt. Aby uzyskać więcej informacji, zobacz Wielokąt. |
Polyline | Polyline wyświetla serię połączonych linii prostych. Aby uzyskać więcej informacji, zobacz Polyline. |
ProgressBar | ProgressBar używa animacji, aby pokazać, że aplikacja przechodzi przez długotrwałe działanie. Aby uzyskać więcej informacji, zobacz ProgressBar. |
RadioButton | RadioButton to typ przycisku, który umożliwia wybór jednej opcji z zestawu. Aby uzyskać więcej informacji, zobacz RadioButton. |
Rectangle | Rectangle wyświetla prostokąt lub kwadrat. Aby uzyskać więcej informacji, zobacz Prostokąt. |
RefreshView | RefreshView to kontrolka kontenera, która zapewnia funkcję ściągania do odświeżania zawartości przewijanej. Aby uzyskać więcej informacji, zobacz RefreshView. |
RoundRectangle | RoundRectangle wyświetla prostokąt lub kwadrat z zaokrąglonymi rogami. Aby uzyskać więcej informacji, zobacz Prostokąt. |
ScrollView | ScrollView Zapewnia przewijanie jego zawartości, która jest zazwyczaj układem. Aby uzyskać więcej informacji, zobacz ScrollView. |
SearchBar | SearchBar to kontrolka danych wejściowych użytkownika używana do inicjowania wyszukiwania. Aby uzyskać więcej informacji, zobacz SearchBar. |
Slider | Slider Umożliwia wybranie double wartości z zakresu ciągłego. Aby uzyskać więcej informacji, zobacz Suwak. |
Stepper | Stepper Umożliwia wybranie double wartości z zakresu wartości przyrostowych. Aby uzyskać więcej informacji, zobacz Stepper. |
SwipeView | SwipeView to kontrolka kontenera, która opakowuje element zawartości i udostępnia elementy menu kontekstowego, które są ujawniane za pomocą gestu przesunięcia. Aby uzyskać więcej informacji, zobacz SwipeView. |
Switch | Switch Umożliwia wybranie wartości logicznej przy użyciu typu przycisku, który może być włączony lub wyłączony. Aby uzyskać więcej informacji, zobacz Przełączanie. |
TableView | TableView Wyświetla tabelę elementów przewijanych, które można zgrupować w sekcjach. Aby uzyskać więcej informacji, zobacz TableView. |
TimePicker | TimePicker umożliwia wybranie godziny z selektorem czasu platformy. Aby uzyskać więcej informacji, zobacz TimePicker. |
TwoPaneView | TwoPaneView reprezentuje kontener z dwoma widokami, które mają rozmiar i umieść ich zawartość w dostępnym miejscu— obok siebie lub u góry do dołu. Aby uzyskać więcej informacji, zobacz TwoPaneView. |
WebView | WebView wyświetla strony internetowe lub lokalną zawartość HTML. Aby uzyskać więcej informacji, zobacz WebView. |