Форум программистов, компьютерный форум, киберфорум
C#: WPF, UWP и Silverlight
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.80/5: Рейтинг темы: голосов - 5, средняя оценка - 4.80
Эксперт .NET
4335 / 1997 / 387
Регистрация: 27.03.2010
Сообщений: 5,450
Записей в блоге: 1
1
.NET 4.x

Создание тени под TextBlock, которая перемещается при изменении размера окна и масштабирования

07.04.2018, 07:36. Просмотров 968. Ответов 1

Начал изучать UWP, параллельно вспоминая WPF (давно с ним не работал). Возникла проблема с тенью под TextBlock. Не совсем понятно, как всё это дело устроено, пока разбираюсь. Хотелось бы, чтобы кто-то подсказал, как сделать так, чтобы тень не уезжала из под TextBlock, когда я меняю размер окна.

C#
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
using System.Numerics;
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Hosting;
 
// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409
 
namespace TextBlockShadowEffect
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }
 
        private void MainPage_OnLoaded(object sender, RoutedEventArgs e)
        {
            var compositor = ElementCompositionPreview.GetElementVisual(_grid).Compositor;
            var spriteVisual = compositor.CreateSpriteVisual();
            spriteVisual.Size = _grid.RenderSize.ToVector2();
 
 
            var dropShadow = compositor.CreateDropShadow();
            dropShadow.BlurRadius = 8;
            dropShadow.Color = Color.FromArgb(255, 120, 107, 107);
            dropShadow.Mask = _timeBlock.GetAlphaMask();
            dropShadow.Offset = new Vector3(0, 0, 0);
            spriteVisual.Shadow = dropShadow;
 
            ElementCompositionPreview.SetElementChildVisual(_grid, spriteVisual);
        }
    }
}
XML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<Page x:Class="TextBlockShadowEffect.MainPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:local="using:TextBlockShadowEffect"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      Loaded="MainPage_OnLoaded"
      mc:Ignorable="d">
 
    <Grid x:Name="_grid" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
 
        <TextBlock x:Name="_timeBlock"
                   Grid.Column="0"
                   Height="128"
                   Margin="0,0,0,0"
                   VerticalAlignment="Center"
                   FontSize="96"
                   Foreground="#FF535353"
                   Style="{StaticResource MainTextBlock}"
                   Text="{Binding Path=Text, FallbackValue='*Placeholder'}"
                   TextAlignment="Center" />
    </Grid>
</Page>
0
Вложения
Тип файла: zip TextBlockShadowEffect.zip (403.2 Кб, 4 просмотров)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
07.04.2018, 07:36
Ответы с готовыми решениями:

Контрол перемещается при изменении окна
Есть контролы (узлы графа). Хотя их положение я меняю через Margin, они привязываются к размеру...

Изменение размера обьектов при изменении размера графического окна
Можно ли в pascalABC.net сделать следующее: чтобы приизменении размера графического окна изменялись...

Qml изменение размера Canvas при изменении размера окна
Может есть какой нибудь способ, чтобы при изменении размера окна (в моем случае window) изменялся...

Артефакт при изменении размера окна
Создал панель на основе класса CDockablePane, все бы ничего если бы при изменении его размеров оно...

1
Эксперт .NET
4335 / 1997 / 387
Регистрация: 27.03.2010
Сообщений: 5,450
Записей в блоге: 1
09.04.2018, 02:48  [ТС] 2
В общем, нужно использовать DropShadowPanel
XML
1
2
3
4
5
6
7
8
9
10
11
            <controls:DropShadowPanel HorizontalAlignment="Center"
                                      VerticalAlignment="Center"
                                      Style="{StaticResource TextDropShadowControlStyle}">
                <TextBlock x:Name="_timeBlock"
                           FontSize="96"
                           Foreground="#FF535353"
                           Style="{StaticResource MainTextBlock}"
                           Text="{Binding Path=Time, Converter={StaticResource DateTimeToTimeStringConverter}, ConverterParameter=TimeFormat, FallbackValue='*12:00 PM'}"
                           TextAlignment="Center"
                           TextWrapping="WrapWholeWords" />
            </controls:DropShadowPanel>
Кликните здесь для просмотра всего текста
XML
1
2
3
4
5
    <Style x:Key="TextDropShadowControlStyle" TargetType="controls:DropShadowPanel">
        <Setter Property="BlurRadius" Value="8" />
        <Setter Property="ShadowOpacity" Value="0.7" />
        <Setter Property="Color" Value="{StaticResource TimeTextShadowColor}" />
    </Style>

Кликните здесь для просмотра всего текста

XML
1
 xmlns:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"


Или сделать так, чтобы TextBlock меняя свой размер обновлял свойство Size объекту типа SpriteVisual (см. первый исходник, станет ясно, думаю)
C#
1
_spriteVisual.Size = _timeBlock.RenderSize.ToVector2();
Добавлено через 2 часа 48 минут
Ещё вот на гитхабе примеры кода, там много всяких контролов с примерами и документацией. Прямо весь исходный код себе клонируете, компилируете и смотрите в виде приложения примеры, там же код и документацию:
https://github.com/Microsoft/UWPCommunityToolkit
1
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
09.04.2018, 02:48

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь.

Перерисовка окна при изменении размера
Наверняка вопрос популярный, но найти пока не смогла. Киньте ссылкой, если есть. Начинаю только...

Изменение меню при изменении размера окна
Здравствуйте. Видел на одном из сайтов такой прием, когда окно во весь экран меню имеет обычный вид...

Перерисовка объектов, при изменении размера окна
Всем доброго времени суток, такая проблема, надо, чтобы при изменении масштаба окна,...

Изменение Форм при изменении размера окна
Доброй ночи Подскажите пожалуйста как правильно реализовать изменение (положение) форм и элементов...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.