wpf - Fondo negro para el editor XAML

silverlight visual-studio-2010

Question

Actualmente estoy trabajando en un control de usuario que tiene texto en blanco y un fondo transparente. Desafortunadamente, debido a que la vista de diseño de XAML dentro de VS2010 tiene un fondo blanco, ¡no puedo ver nada de lo que estoy diseñando!

He revisado todos los cuadros de diálogo de configuración que se me ocurren, pero no he podido encontrar una configuración que cambie el color de fondo del diseñador de XAML.

¿Alguien sabe cómo se puede hacer esto?

Answer 1

¿Puedes usar Blend para diseñar? Blend tiene una opción para cambiar entre los esquemas de color claro y oscuro.

Answer 2

Alternativamente, a partir de VS 2013, puede hacer esto en Herramientas -> Opciones -> Fuentes y colores, XAML UI Designer.

Los colores de primer plano / fondo editables son los colores del fondo del tablero de ajedrez. Acabo de ponerlos a ambos en un color gris oscuro que parece funcionar tanto para el fondo oscuro como para el tema oscuro.

Answer 3

Como se muestra en esta publicación , puede condensar el código en un único estilo utilizando un desencadenador, ya que DesignerProperties.IsInDesignMode es una propiedad adjunta .

En realidad, el código allí no es del todo correcto. Define un estilo implícito para TargetType="{x:Type UserControl}" , que se ignoraría en tiempo de ejecución de todos modos porque tu UserControl es en realidad una clase derivada, como señala Metro Smurf en su primer punto:

App.xaml efectuará UserControl en tiempo de diseño porque un estilo escrito se aplica automáticamente a un objeto, pero no se aplica a un objeto derivado (UserControl en este caso). Entonces, en el momento del diseño, VS cree que debería aplicar el estilo, pero en el tiempo de ejecución, será ignorado.

La forma correcta de hacerlo sería darle una clave y aplicarla manualmente a sus UserControls:

<Application
    ...
    xmlns:componentModel="clr-namespace:System.ComponentModel;assembly=PresentationFramework">
    ...
    <Application.Resources>
        ...
        <Style x:Key="DesignerBlackBackgroundStyle" TargetType="Control">
            <Style.Triggers>
                <Trigger Property="componentModel:DesignerProperties.IsInDesignMode"
                         Value="True">
                    <Setter Property="Background" Value="Black" />
                </Trigger>
            </Style.Triggers>
        </Style>

y:

<UserControl x:Class="MyUserControl"
             Style="{StaticResource ResourceKey=DesignerBlackBackgroundStyle}">

Como desencadenante, esto tiene un beneficio adicional sobre la configuración del fondo en código subyacente: se comportará correctamente si el fondo se establece explícitamente en otro lugar, como desde un UserControl que contenga:

<UserControl x:Class="ContainerUserControl" ...>
    ...
    <local:MyUserControl Background="Gray" />

Los valores locales tienen prioridad sobre los activadores de estilo , por lo que en esta pantalla el diseñador usaría un fondo gris, mientras que sería negro al diseñar MyUserControl de manera independiente.

Answer 4

En su XAML, configure su fondo en negro. Luego, en su control de usuario, use DesignerProperties para establecer el fondo en tiempo de ejecución:

XAML

<UserControl .... Background="Black" .... >

Código detrás

public YourUserControl()
{
  InitializeComponent();

  if( !System.ComponentModel.DesignerProperties.GetIsInDesignMode( this ) )
  {
    this.Background = Brushes.Transparent;
  }

}

Metodo alternativo

Control de usuario:

En su control de usuario, no declare un color de fondo:

<UserControl ... namespaces ...>

Código de control de usuario detrás:

En el constructor del control de usuario, use el método DesignTime como se indicó anteriormente, pero verifique si es el modo de diseño (verificación opuesta a la de otro método):

public YourUserControl()
{
  InitializeComponent();

  if( System.ComponentModel.DesignerProperties.GetIsInDesignMode( this ) )
  {
    this.Background = Brushes.Black;
  }

}

App.xaml:

Finalmente, en su App.xaml, agregue un estilo para establecer un color de fondo para UserControls:

<Application.Resources>
  <Style TargetType="{x:Type UserControl}">
    <Setter Property="Background" Value="Black" />
  </Style>
</Application.Resources>

Esto es lo que está pasando:

1. App.xaml efectuará UserControl en tiempo de diseño porque un estilo escrito se aplica automáticamente a un objeto, pero no se aplica a un objeto derivado (UserControl en este caso). Entonces, en el momento del diseño, VS cree que debería aplicar el estilo, pero en el tiempo de ejecución, será ignorado.
2. La comprobación GetIsInDesignMode afectará al UserControl al visualizar el control en una ventana que usa UserControl porque VS está compilando UserControl en tiempo de diseño para representarlo en Visual Designer.

HTH

Answer 5

Establezca el color de fondo del control de usuario en negro en el XAML, luego configúrelo como transparente en el código.

Editar: si no te sientes cómodo dejando el código de esta manera, puedes revertir este cambio antes de lanzar, una vez que hayas terminado con todo el trabajo del diseñador, aunque no hay ningún problema al dejarlo.