Compartilhar via


Visão geral das caixas de diálogo (WPF .NET)

O Windows Presentation Foundation (WPF) fornece maneiras de criar suas próprias caixas de diálogo. As caixas de diálogo são janelas, mas com uma intenção e experiência do usuário específicas. Este artigo discute como uma caixa de diálogo funciona e quais tipos de caixas de diálogo você pode criar e usar. As caixas de diálogo são usadas para:

  • Exibir informações específicas aos usuários.
  • Coletar informações de usuários.
  • Exibir e coletar informações.
  • Exiba um prompt do sistema operacional, como print window.
  • Selecione um arquivo ou pasta.

Esses tipos de janelas são conhecidos como caixas de diálogo. Uma caixa de diálogo pode ser exibida de duas maneiras: modal e sem janela restrita.

Exibir uma caixa de diálogo modal para o usuário é uma técnica com a qual o aplicativo interrompe o que estava fazendo até que o usuário feche a caixa de diálogo. Isso geralmente vem na forma de um prompt ou alerta. Não é possível interagir com outras janelas no aplicativo até que a caixa de diálogo seja fechada. Depois que a caixa de diálogo modal é fechada, o aplicativo continua. As caixas de diálogo mais comuns são usadas para mostrar um arquivo aberto ou salvar o prompt, exibindo a caixa de diálogo da impressora ou enviando mensagens ao usuário com algum status.

Uma caixa de diálogo sem janela restrita não impede que um usuário ative outras janelas enquanto ela estiver aberta. Por exemplo, se um usuário quiser localizar ocorrências de uma palavra específica em um documento, uma janela principal geralmente abrirá uma caixa de diálogo para perguntar a um usuário qual palavra ele está procurando. Como o aplicativo não deseja impedir que o usuário edite o documento, a caixa de diálogo não precisa ser modal. Uma caixa de diálogo sem janela restrita fornece pelo menos um botão Fechar para fechar a caixa de diálogo. Outros botões podem ser fornecidos para executar funções específicas, como um botão Localizar próximo para encontrar a próxima palavra em uma pesquisa de palavras.

Com o WPF, você pode criar vários tipos de caixas de diálogo, como caixas de mensagem, caixas de diálogo comuns e caixas de diálogo personalizadas. Este artigo discute cada um deles, e o Exemplo de Caixa de Diálogo fornece exemplos correspondentes.

Caixas de mensagens

Uma caixa de mensagem é uma caixa de diálogo que pode ser usada para exibir informações textuais e permitir que os usuários tomem decisões com os botões. A figura a seguir mostra uma caixa de mensagem que faz uma pergunta e fornece ao usuário três botões para responder à pergunta.

Caixa de diálogo do processador de texto perguntando se você deseja salvar as alterações no documento antes que o aplicativo seja fechado.

Para criar uma caixa de mensagem, use a MessageBox classe. MessageBox Permite configurar o texto, o título, o ícone e os botões da caixa de mensagem.

Para obter mais informações, consulte Como abrir uma caixa de mensagem.

Caixas de diálogo comuns

O Windows implementa diferentes tipos de caixas de diálogo reutilizáveis que são comuns a todos os aplicativos, incluindo caixas de diálogo para selecionar arquivos e imprimir.

Como essas caixas de diálogo são fornecidas pelo sistema operacional, elas são compartilhadas entre todos os aplicativos executados no sistema operacional. Essas caixas de diálogo fornecem uma experiência de usuário consistente e são conhecidas como caixas de diálogo comuns. Como um usuário usa uma caixa de diálogo comum em um aplicativo, ele não precisa aprender a usar essa caixa de diálogo em outros aplicativos.

O WPF encapsula as caixas de diálogo comuns de abrir arquivo, salvar arquivo, abrir pasta e imprimir e as expõe como classes gerenciadas para você usar.

Uma caixa de diálogo 'Abrir Arquivo' chamada do WPF.

Para saber mais sobre caixas de diálogo comuns, consulte os seguintes artigos:

Caixas de diálogo personalizadas

Embora as caixas de diálogo comuns sejam úteis e devam ser usadas quando possível, elas não dão suporte aos requisitos de caixas de diálogo específicas do domínio. Nesses casos, você precisa criar suas próprias caixas de diálogo. Como veremos, uma caixa de diálogo é uma janela com comportamentos especiais. Window implementa esses comportamentos e você usa a janela para criar caixas de diálogo modais e sem janela restrita personalizadas.

Há muitas considerações de design a serem levadas em conta ao criar sua própria caixa de diálogo. Embora uma janela de aplicativo e uma caixa de diálogo contenham semelhanças, como compartilhar a mesma classe base, uma caixa de diálogo é usada para uma finalidade específica. Normalmente, uma caixa de diálogo é necessária quando você precisa solicitar a um usuário algum tipo de informação ou resposta. Normalmente, o aplicativo será pausado enquanto a caixa de diálogo (modal) é exibida, restringindo o acesso ao restante do aplicativo. Depois que a caixa de diálogo é fechada, o aplicativo continua. No entanto, limitar as interações apenas à caixa de diálogo não é um requisito.

Quando uma janela do WPF é fechada, ela não pode ser reaberta. As caixas de diálogo personalizadas são janelas do WPF e a mesma regra se aplica. Para saber como fechar uma janela, consulte Como fechar uma janela ou caixa de diálogo.

Como implementar uma caixa de diálogo

Ao criar uma caixa de diálogo, siga estas sugestões para criar uma boa experiência do usuário:

❌ NÃO sobrecarregue a janela de diálogo. A experiência de diálogo é para o usuário inserir alguns dados ou fazer uma escolha.

✔️ Forneça um botão OK para fechar a janela.

✔️ DEFINA a propriedade do IsDefault botão OK para true permitir que o usuário pressione a tecla ENTER para aceitar e fechar a janela.

✔️ CONSIDERE adicionar um botão Cancelar para que o usuário possa fechar a janela e indicar que não deseja continuar.

✔️ Defina a propriedade do IsCancel botão Cancelar como true para permitir que o usuário pressione a tecla ESC para fechar a janela.

✔️ Defina o título da janela para descrever com precisão o que a caixa de diálogo representa ou o que o usuário deve fazer com a caixa de diálogo.

✔️ Defina valores mínimos de largura e altura para a janela, impedindo que o usuário redimensione a janela muito pequena.

✔️ CONSIDERE desabilitar a capacidade de redimensionar a janela se ShowInTaskbar estiver definido como false. Você pode desativar o redimensionamento definindo ResizeMode como NoResize

O código a seguir demonstra essa configuração.

<Window x:Class="Dialogs.Margins"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Change Margins"
        Closing="Window_Closing"
        MinHeight="200"
        MinWidth="300"
        SizeToContent="WidthAndHeight"
        ResizeMode="NoResize"
        ShowInTaskbar="False"
        WindowStartupLocation="CenterOwner" 
        FocusManager.FocusedElement="{Binding ElementName=leftMarginTextBox}">
    <Grid Margin="10">
        <Grid.Resources>
            <!-- Default settings for controls -->
            <Style TargetType="{x:Type Label}">
                <Setter Property="Margin" Value="0,3,5,5" />
                <Setter Property="Padding" Value="0,0,0,5" />
            </Style>
            <Style TargetType="{x:Type TextBox}">
                <Setter Property="Margin" Value="0,0,0,5" />
            </Style>
            <Style TargetType="{x:Type Button}">
                <Setter Property="Width" Value="70" />
                <Setter Property="Height" Value="25" />
                <Setter Property="Margin" Value="5,0,0,0" />
            </Style>
        </Grid.Resources>

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>

        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition />
        </Grid.RowDefinitions>

        <!-- Left,Top,Right,Bottom margins-->
        <Label Grid.Column="0" Grid.Row="0">Left Margin:</Label>
        <TextBox Name="leftMarginTextBox" Grid.Column="1" Grid.Row="0" />

        <Label Grid.Column="0" Grid.Row="1">Top Margin:</Label>
        <TextBox Name="topMarginTextBox" Grid.Column="1" Grid.Row="1"/>

        <Label Grid.Column="0" Grid.Row="2">Right Margin:</Label>
        <TextBox Name="rightMarginTextBox" Grid.Column="1" Grid.Row="2" />

        <Label Grid.Column="0" Grid.Row="3">Bottom Margin:</Label>
        <TextBox Name="bottomMarginTextBox" Grid.Column="1" Grid.Row="3" />

        <!-- Accept or Cancel -->
        <StackPanel Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="4" Orientation="Horizontal" HorizontalAlignment="Right">
            <Button Name="okButton" Click="okButton_Click" IsDefault="True">OK</Button>
            <Button Name="cancelButton" IsCancel="True">Cancel</Button>
        </StackPanel>
    </Grid >
</Window>

O XAML acima cria uma janela semelhante à imagem a seguir:

Uma janela de caixa de diálogo para WPF que mostra caixas de texto esquerda, superior, direita e inferior.

Elementos da interface do usuário abrindo uma caixa de diálogo

A experiência do usuário para uma caixa de diálogo também se estende para a barra de menus ou o botão da janela que a abre. Quando um item de menu ou botão executa uma função que requer interação do usuário por meio de uma caixa de diálogo antes que a função possa continuar, o controle deve usar reticências no final do texto do cabeçalho:

<MenuItem Header="_Margins..." Click="formatMarginsMenuItem_Click" />
<!-- or -->
<Button Content="_Margins..." Click="formatMarginsButton_Click" />

Quando um item de menu ou botão executa uma função que exibe uma caixa de diálogo que não requer interação do usuário, como uma caixa de diálogo Sobre , uma reticência não é necessária.

Os itens de menu são uma maneira comum de fornecer aos usuários ações de aplicativo agrupadas em temas relacionados. Você provavelmente já viu o menu Arquivo em muitos aplicativos diferentes. Em um aplicativo típico, o item de menu Arquivo fornece maneiras de salvar um arquivo, carregar um arquivo e imprimir um arquivo. Se a ação for exibir uma janela modal, o cabeçalho normalmente incluirá reticências, conforme mostrado na imagem a seguir:

Uma janela do WPF que mostra itens de menu com reticências para indicar qual item mostra uma caixa de diálogo.

Dois dos itens do menu têm reticências: .... Isso ajuda o usuário a identificar que, ao selecionar esses itens de menu, uma janela modal é mostrada, pausando o aplicativo até que o usuário o feche.

Essa técnica de design é uma maneira fácil de comunicar aos usuários o que eles devem esperar.

Botões

Você pode seguir o mesmo princípio descrito na seção Itens de menu. Use reticências no texto do botão para indicar que, quando o usuário pressionar o botão, uma caixa de diálogo modal será exibida. Na imagem a seguir, há dois botões e é fácil entender qual botão exibe uma caixa de diálogo:

Uma janela do WPF que mostra botões com reticências para indicar qual item mostra uma caixa de diálogo.

Retornar um resultado

Abrir outra janela, especialmente uma caixa de diálogo modal, é uma ótima maneira de retornar status e informações ao código de chamada.

Quando uma caixa de diálogo é mostrada chamando ShowDialog(), o código que abriu a caixa de diálogo aguarda até que o ShowDialog método retorne. Quando o método retorna, o código que o chamou precisa decidir se deseja continuar o processamento ou interromper o processamento. O usuário geralmente indica isso pressionando um botão OK ou Cancelar na caixa de diálogo.

Quando o botão OK é pressionado, ShowDialog deve ser projetado para retornar true, e o botão Cancelar para retornar false. Isso é feito definindo a DialogResult propriedade quando o botão é pressionado.

private void okButton_Click(object sender, RoutedEventArgs e) =>
    DialogResult = true;

private void cancelButton_Click(object sender, RoutedEventArgs e) =>
    DialogResult = false;
Private Sub okButton_Click(sender As Object, e As RoutedEventArgs)
    DialogResult = True
End Sub

Private Sub cancelButton_Click(sender As Object, e As RoutedEventArgs)
    DialogResult = False
End Sub

A DialogResult propriedade só pode ser definida se a caixa de diálogo tiver sido exibida com ShowDialog(). Quando a DialogResult propriedade é definida, a caixa de diálogo é fechada.

Se a propriedade de IsCancel um botão estiver definida como true, e a janela for aberta com ShowDialog(), a tecla ESC fechará a janela e definirá DialogResult como false.

Para obter mais informações sobre como fechar caixas de diálogo, consulte Como fechar uma janela ou caixa de diálogo.

Processar a resposta

O ShowDialog() retorna um valor booleano para indicar se o usuário aceitou ou cancelou a caixa de diálogo. Se você estiver alertando o usuário sobre algo, mas não exigir que ele tome uma decisão ou forneça dados, poderá ignorar a resposta. A resposta também pode ser inspecionada verificando a DialogResult propriedade. O código a seguir mostra como processar a resposta:

var dialog = new Margins();

// Display the dialog box and read the response
bool? result = dialog.ShowDialog();

if (result == true)
{
    // User accepted the dialog box
    MessageBox.Show("Your request will be processed.");
}
else
{
    // User cancelled the dialog box
    MessageBox.Show("Sorry it didn't work out, we'll try again later.");
}
Dim marginsWindow As New Margins

Dim result As Boolean? = marginsWindow.ShowDialog()

If result = True Then
    ' User accepted the dialog box
    MessageBox.Show("Your request will be processed.")
Else
    ' User cancelled the dialog box
    MessageBox.Show("Sorry it didn't work out, we'll try again later.")
End If

marginsWindow.Show()

Caixa de diálogo sem janela restrita

Para mostrar uma caixa de diálogo sem janela restrita, chame Show(). A caixa de diálogo deve fornecer pelo menos um botão Fechar . Outros botões e elementos interativos podem ser fornecidos para executar uma função específica, como um botão Localizar próximo para encontrar a próxima palavra em uma pesquisa de palavras.

Como uma caixa de diálogo sem janela restrita não impede que o código de chamada continue, você deve fornecer uma maneira diferente de retornar um resultado. Você tem as seguintes opções:

  • Exponha uma propriedade de objeto de dados na janela.
  • Manipule o Window.Closed evento no código de chamada.
  • Crie eventos na janela que são gerados quando o usuário seleciona um objeto ou pressiona um botão específico.

O exemplo a seguir usa o Window.Closed evento para exibir uma caixa de mensagem para o usuário quando a caixa de diálogo é fechada. A mensagem exibida faz referência a uma propriedade da caixa de diálogo fechada. Para obter mais informações sobre como fechar caixas de diálogo, consulte Como fechar uma janela ou caixa de diálogo.

var marginsWindow = new Margins();

marginsWindow.Closed += (sender, eventArgs) =>
{
    MessageBox.Show($"You closed the margins window! It had the title of {marginsWindow.Title}");
};

marginsWindow.Show();
Dim marginsWindow As New Margins

AddHandler marginsWindow.Closed, Sub(sender As Object, e As EventArgs)
                                     MessageBox.Show($"You closed the margins window! It had the title of {marginsWindow.Title}")
                                 End Sub

marginsWindow.Show()

Confira também