[WPF] Ventana sin bordes


Este no va a ser un artículo muy largo pues sólo se explicará cómo obtener una ventana sin bordes y agregar la funcionalidad de que se pueda mover, minimizar y cerrar.

Comencemos primero quitando los bordes de la ventana.

<Window x:Class="Windowless.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525"
        WindowStyle="None"
        AllowsTransparency="True" Background="Transparent">

</Window>

La propiedad WindowStyle nos ayudará a quitar el borde donde se encuentra los botones (maximizar, minimizar y cerrar); con la propiedad AllowsTransparency creará una zona donde se permita la transparencia, esto unido al Background transparente terminará en una ventana completamente transparente.

Ahora veamos el resto de código donde se muestra la creación de la barra de título y los botones.

<Border Margin="10" BorderBrush="Red" BorderThickness="0.5">
    <Border.Effect>
        <DropShadowEffect Color="Black"
                          Direction="320"
                          BlurRadius="15"
                          ShadowDepth="3" />
    </Border.Effect>
    <DockPanel LastChildFill="True" Background="White">
        <Grid DockPanel.Dock="Top" Height="25">
            <TextBlock Text="{Binding Path=Title, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Window}}"
                       HorizontalAlignment="Center" />
            <Rectangle Name="titleBar"
                       Fill="Transparent"
                       MouseLeftButtonDown="titleBar_MouseLeftButtonDown"/>
            <Button Name="closeButton"
                    Style="{StaticResource CerrarStyle}"
                    HorizontalAlignment="Right"
                    Width="15" Margin="0,0,5,0" Height="15"
                    Click="closeButton_Click"/>
            <Button Name="minButton"
                    Style="{StaticResource MinimizarStyle}"
                    HorizontalAlignment="Right"
                    Width="15" Margin="0,0,25,0" Height="9"
                    Click="minButton_Click"/>
        </Grid>
        <Grid Name:"Contenido">

        </Grid>
    </DockPanel>
</Border>

Los eventos de los botones y el rectángulo están definidos así:

private void titleBar_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    this.DragMove();
}

private void closeButton_Click(object sender, RoutedEventArgs e)
{
    this.Close();
}

private void minButton_Click(object sender, RoutedEventArgs e)
{
    this.WindowState = System.Windows.WindowState.Minimized;
}

Y eso sería todo para crear nuestra ventana sin bordes. Como siempre les dejo el archivo en C# (Windowless.zip), esta vez no publicaré el de VB.NET pues es bastante sencillo de convertir.

Anuncios

8 Respuestas a “[WPF] Ventana sin bordes

  1. Falta el boton de maximizar y restaurar, como lo hago?

  2. Los estilos Style=”{StaticResource CerrarStyle} y el de minimizar los puedes mostrar

  3. ya descargue el codigo fuente si….
    Gracias por el post .. esta muy bueno para personas que inician con WPF como yo ….

  4. Oye yo quiero hacer eso pero no lo entiendo 😦

  5. no anda ese link

  6. gracias bro!!!!

  7. CerrarStyle y MinimizarStyle no están en el codigo

  8. hola.. no anda el link y falta codigo.. porfa si pueden subirlo o poner lo que falta se los agradeceria!

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s