Можно ли управлять композицией XAML ElementVisual Clipping?

Я использую UWP и работаю с Composition API для программного масштабирования дочерних текстовых визуальных элементов, вложенных в типичную иерархию XAML. Текстовые блоки в нашем приложении содержатся в таких вещах, как границы, и некоторые из этих границ являются элементами, содержащимися в GridView.

Во многих сценариях я испытываю отсечение связанного текстового визуала, поскольку он масштабируется, чтобы быть больше, чем некоторые контейнеры XAML, содержащие элементы, и я хотел бы, чтобы визуал не обрезался, поскольку он масштабируется, чтобы быть больше, чем его родитель.

Вот простой пример, который демонстрирует некоторые проблемы, которые я вижу...

Мое тестовое приложение запускается как пустое приложение UWP, а корневая сетка моей страницы содержит следующее Gridview:

        <GridView  >
        <GridViewItem>
            <Border PointerPressed="Border_PointerPressed" CornerRadius="5" Width="125" Height="125">
                <Grid>
                    <TextBlock Text="Content String 1" />
                </Grid>
            </Border>
        </GridViewItem>
        <GridViewItem>
            <Border PointerPressed="Border_PointerPressed" Width="125" Height="125">
                <Grid>
                    <TextBlock Text="Content String 2" />
                </Grid>
            </Border>
        </GridViewItem>
        <GridViewItem>
            <Border PointerPressed="Border_PointerPressed" Width="125" Height="125">
                <Grid>
                    <TextBlock Text="Content String 3"/>
                </Grid>
            </Border>
        </GridViewItem>
    </GridView>

Файл codebehind содержит следующие дополнительные операторы using, объявление переменной, инициализацию переменной в конструкторе страницы и этот обработчик события:

using System.Numerics;
using Windows.UI.Composition;
using Windows.UI.Xaml.Hosting;

    Compositor compositor;

    public MainPage()
    {
        this.InitializeComponent();
        compositor = ElementCompositionPreview.GetElementVisual(this).Compositor;
    }

    private void Border_PointerPressed(object sender, PointerRoutedEventArgs e)
    {
        var content = VisualTreeHelper.GetChild(VisualTreeHelper.GetChild(sender as FrameworkElement, 0), 0);
        var visual = ElementCompositionPreview.GetElementVisual(content as FrameworkElement);

        var animation = compositor.CreateVector3KeyFrameAnimation();
        animation.InsertKeyFrame(0f, new Vector3(1.0f, 1.0f, 0.0f));
        animation.InsertKeyFrame(0.5f, new Vector3(3.0f, 3.0f, 0.0f));
        animation.InsertKeyFrame(1f, new Vector3(1.0f, 1.0f, 0.0f));
        animation.Duration = TimeSpan.FromMilliseconds(5000);

        visual.StartAnimation(nameof(visual.Scale), animation);
    }

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

Первая строка обрезается в ограничительной рамке Border, а две другие - нет. Также обратите внимание, что две другие строки, кажется, масштабируются за пределы границ последнего элемента и выходят на страницу, но, вероятно, это происходит из-за автоматического изменения размера сетки при заполнении страницы.

Разница между первой строкой и двумя другими заключается в том, что для границы установлено свойство углового радиуса. Мы используем настройку углового радиуса в нашем приложении, поэтому было бы неплохо узнать, есть ли способ переопределить или контролировать это поведение, чтобы оно не обрезало визуальное изображение при масштабировании.

Другое поведение, которое вызывает у нас проблемы, заключается в том, что на границах GridView есть еще одна граница, на которую визуализируется ограничение при масштабировании. Если вы установите какое-либо свойство (например, HorizontalAlignment="Center") в Gridview, которое заставляет его масштабироваться так, чтобы оно становилось настолько большим, насколько это необходимо, тогда визуальное изображение обрезается на границах элементов управления.

Есть ли что-нибудь в Compositional API, которое позволяет мне предотвращать или влиять на это поведение отсечения?

0 ответов

Другие вопросы по тегам