Udostępnij za pośrednictwem

Dialog Kontrola (eksperymentalna)

  • Artykuł

[Ten artykuł stanowi wstępną wersję dokumentacji i może ulec zmianie.]

Formant używany do grupowania zawartości.

Kontolka Dialog.

Ważne

  • To jest funkcja objęta programem eksperymentalnym.
  • Funkcje w wersji eksperymentalnej nie są przeznaczone do użytku w środowiskach produkcyjnych i mogą mieć ograniczoną funkcjonalność. Te funkcje są udostępniane przed oficjalnym wydaniem, dzięki czemu klienci mogą szybciej uzyskać do nich dostęp i przekazać opinie na ich temat.

opis

Okno dialogowe (Dialog) to tymczasowe wyskakujące okienko, na stronie lub w aplikacji, na których użytkownicy mają się skoncentrować. Jest głównie używany do potwierdzenia działań, takich jak usuwanie pliku, lub do prośby o możliwość wyboru.

Ten składnik kanwy imituje styl i zachowanie formantu Wyszukiwanie przy interfejsie użytkownika Dialog Fluent UI. Zapoznaj się z dokumentacją najlepszych rozwiązań.

Wyświetl komponent w repozytorium GitHub Creator Kit.

Właściwości

Właściwości klucza

Właściwości opis
Buttons Zestaw danych definiujący przyciski (patrz właściwości poniżej)
Title Tekst wyświetlany w sekcji tytułu
OverlayColor Kolor wyświetlany w obszarze pochyłym
DialogWidth Szerokość Dialog (nie należy mylić z szerokością kontrolki, która powinna obejmować szerokość aplikacji)
DialogHeight Wysokość Dialog (nie mylić z wysokością kontrolki, która powinna obejmować wysokość aplikacji).
SubTitle Tekst wyświetlany pod tytułem

Buttons Właściwości

Właściwości opis
Label Etykieta wyświetlana na przycisku.
ButtonType Wyliczenie, które określa wygląd przycisku. Wybierz spośród Standard i Primary. 
Table(
    {
        Label: "Cancel", 
        ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Standard 
    },{
        Label: "Ok", 
        ButtonType:'Microsoft.CoreControls.Button.ButtonType'.Primary
    }
)

Właściwości stylu

Właściwości opis
Theme Obiekt motywu. Zobacz motywy, aby uzyskać wskazówki dotyczące konfiguracji.

Aby uzyskać informacje o formatowaniu, zobacz wskazówki w sekcji zawartości panelu Format w Panelu.

Właściwości zdarzenia

Właściwości opis
OnCloseSelect Wyrażenie akcji wykonywane po wybraniu przycisku zamknięcia.
OnButtonSelect Wyrażenie akcji, które jest wykonywane po wybraniu jednego z przycisków akcji.

Zachowanie

Konfigurowanie widoczności Dialog

Spraw, aby kontrolka Dialog (lub powierzchnia, w której się znajduje) była widoczna, gdy zmienna typu logicznego (prawda/fałsz) zmieni się na true i przypisz tę zmienną do właściwości widoczności okna dialogowego. Po wyświetleniu okna dialogowego można je ukryć, aktualizując zmienną we właściwości resetowania, która jest wyzwalana po kliknięciu ikony zamykania.

Następująca Formuła Power Fx do otwierania okna dialogowego w formule akcji na innym komponencie gdzieś w aplikacji (na przykład właściwość OnSelect przycisku):

UpdateContext({ showHideDialog: true })

Następującą formułę Power Fx do zamknięcia dialogu, we właściwości OnCloseSelect okienka dialogowego:

UpdateContext({ showHideDialog: false })

Przypisz zmienną do Visible właściwości sesji dialogowej:

showHideDialog

Skonfiguruj akcje przycisków

We właściwości OnButtonSelect okna dialogowego podaj akcje w warunku If() lub Switch() na podstawie wartości tekstowej Self.SelectedButton.Label, aby zdefiniować akcję. W zależności od akcji warto także zamknąć dialog po zakończeniu akcji.

    If( Self.SelectedButton.Label = "Send", 
        Notify("Email Sent")
    );
    UpdateContext({ showHideDialog: false })

Ograniczenia

Tego składnika kanwy można używać tylko w aplikacjach kanwy i na stronach niestandardowych.