Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

783
Views
¿Cómo imitar OuterGlowBitmapEffect usando efectos WPF?

Intenté usar DropShadowEffect pero su fuerza de "brillo" se debilita cuando aumentas BlurRadius. Quiero tener un fuerte brillo exterior como la imagen de abajo.

ingrese la descripción de la imagen aquí

Si apilo el mismo efecto una docena de veces, puedo obtener esto, pero el rendimiento se estanca después de esto. ¿Es posible hacerlo usando WPF con un solo efecto?

over 4 years ago · Santiago Trujillo
1 answers
Answer question

0

Dependiendo de qué tan grande desee que sea el radio del desenfoque y qué tan suave debe ser el resultado, puede apilar diferentes efectos como paradas de degradado en lugar de apilar repetidamente el mismo efecto.


Como usted señaló, la fuerza de DropShadowEffect se debilita a medida que aumenta BlurRadius .

Ejemplo de un control WPF

 <TextBox Text="DropShadowEffect"> <TextBox.Effect> <DropShadowEffect BlurRadius="50" ShadowDepth="0" Color="Blue" Opacity="1"/> </TextBox.Effect> </TextBox>

Además, la aplicación de efectos directamente al cuadro de TextBox afecta la calidad de representación del texto . La solución propuesta para la pregunta vinculada (establecer TextOptions.TextFormattingMode="Display" en la Window ) también tiene implicaciones de diseño. En su lugar, puede dibujar un Rectangle con un BlurEffect detrás de su elemento.

Ejemplo de un control WPF

 <Rectangle Fill="Blue" Height={Binding ElementName=MyTextBox, Path=ActualHeight}" Width={Binding ElementName=MyTextBox, Path=ActualWidth}"> <Rectangle.Effect> <BlurEffect Radius="50"/> </Rectangle.Effect> </Rectangle> <TextBox x:Name="MyTextBox" Text="Rectangle with BlurEffect"/>

Luego puede agregar un Rectangle adicional para cada parada de degradado. Aquí hay dos: uno en 50 para definir el tamaño general del desenfoque y otro en 30 para fortalecer el brillo alrededor del control.

Ejemplo de un control WPF

 <Rectangle Fill="Blue" Height={Binding ElementName=MyTextBox, Path=ActualHeight}" Width={Binding ElementName=MyTextBox, Path=ActualWidth}"> <Rectangle.Effect> <BlurEffect Radius="50"/> </Rectangle.Effect> </Rectangle> <Rectangle Fill="Blue" Height={Binding ElementName=MyTextBox, Path=ActualHeight}" Width={Binding ElementName=MyTextBox, Path=ActualWidth}"> <Rectangle.Effect> <BlurEffect Radius="30"/> </Rectangle.Effect> </Rectangle> <TextBox x:Name="MyTextBox" Text="Two Rectangles with BlurEffect"/>

Preguntaste sobre la nitidez percibida en las esquinas del cuadro de TextBox y debo admitir que no tengo una buena solución. Inicialmente consideré redondear las esquinas de los elementos borrosos detrás de su control usando un Border en lugar de un Rectangle , pero honestamente no veo mucha diferencia.

Ejemplo de un control WPF

 <!-- Remove the CornerRadius property for square corners. --> <Border CornerRadius="10" Background="Blue"> <Border.Effect> <BlurEffect Radius="50"/> </Border.Effect> </Border> <Border CornerRadius="10" Background="Blue"> <Border.Effect> <BlurEffect Radius="30"/> </Border.Effect> </Border>

Por supuesto, siempre puede hacer que los objetos de fondo sean más grandes que su control. Aquí están en la misma celda de una Grid , pero hay espacio adicional para que Border el borde porque el TextBox de texto tiene un Margin . Un margen superior/inferior más pequeño y un margen izquierdo/derecho más grande significa que el brillo será más uniforme alrededor del control.

Ejemplo de un control WPF

 <!-- These items should be in the same cell of a Grid --> <Border CornerRadius="10" Background="Blue"> <Border.Effect> <BlurEffect Radius="50"/> </Border.Effect> </Border> <Border CornerRadius="10" Background="Blue"> <Border.Effect> <BlurEffect Radius="30"/> </Border.Effect> </Border> <TextBox Text="TextBox has an 8px, 4px margin" Margin="8 4"/>
over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!