2016-11-20 3 views
0

Я пытаюсь получить ContentControl, чтобы применить ContentThemeTransition, где содержимое будет строкой, поэтому, когда строка изменится с помощью привязки, новая строка будет анимирована. Я не могу использовать ContentThemeTransition с a TextBlock, поскольку это не происходит от ContentControl.UWP ContentControl не применяет ContentThemeTransition

Вот пример XAML, который показывает проблему. Если я отредактирую текст в текстовом поле (который представляет текст в моей модели ViewModel, который действительно связан с ContentControl), я ожидаю, что текст, показанный в ContentControl, будет анимироваться, но это не так.

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid.RowDefinitions> 
     <RowDefinition/> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 

    <TextBox Grid.Row="0" x:Name="text" Text="Hello" Width="100" Height="30"/> 
    <ContentControl Grid.Row="1" Width="100" Height="100" Content="{Binding ElementName=text , Path=Text}"> 
     <ContentControl.Transitions> 
      <TransitionCollection> 
       <ContentThemeTransition HorizontalOffset="40"/> 
      </TransitionCollection> 
     </ContentControl.Transitions> 
    </ContentControl> 
</Grid> 

Что я делаю неправильно?

Большое спасибо за любую помощь.

UPDATE:

Хорошо, уже где-то в настоящее время. Если заменить ContentControl XAML в

<ContentPresenter Background="Black" Foreground="Red" Grid.Row="1" Width="100" Height="100" Content="{Binding ElementName=text , Path=Text}"> 
     <ContentPresenter.ContentTransitions> 
      <TransitionCollection> 
       <ContentThemeTransition VerticalOffset="-100"/> 
      </TransitionCollection> 
     </ContentPresenter.ContentTransitions> 
    </ContentPresenter> 

затем он работает. Как ни странно, с VerticalOffset = -100, как и выше, новое значение анимируется за пределами ContentControl, то есть его видимого вне границ элемента управления. Кто-нибудь знает, как изменить ситуацию, поэтому анимация появляется только в пределах ContentPresenter?

ответ

1

Протестировано на моей стороне, ваше первое <ContentThemeTransition HorizontalOffset="40"/> и второе <ContentThemeTransition VerticalOffset="-100"/> оба работают, но только в первый раз, вы можете увеличить HorizontalOffset для тестирования и проверить, работает ли оно.

Поскольку вы ожидали, что анимация должна работать каждый раз, когда текст меняется, я думаю, вам нужно будет создать анимацию, которая нацелена на Text из TextBlock непосредственно вместо ориентации на Content из ContentControl. В этом случае XAML Behaviors будет хорошим помощником. Вы можете обратиться к @Jerry Никсон - ответ MSFT в теме: How to animate TextBlock when its value changes in WinRT XAML?

Обновление:

Моя ошибка, что я только заметил, что вы изменили HorizontalOffset к VerticalOffset. Вы фактически также изменили ContentControl на ContentPresenter.

В соответствии с UI координатой UWP, поскольку ваша анимационная цель ContentPresenter, тогда рассмотрите левую верхнюю точку вашего ContentPresent (0, 0). Когда вы установили <ContentThemeTransition VerticalOffset="-100"/>, он будет переходить от (0, -100) обратно к (0, 0), и он определенно будет анимироваться за пределами вашего ContentPresent, я думаю, что он создан так, и мы не можем его изменить , Здесь я могу только предположить, что изменение перехода от вниз до <ContentThemeTransition VerticalOffset="100"/>, это поможет немного здесь, но со временем это изменит вашу анимацию, поэтому я не думаю, что это будет хороший подход.

+0

Привет @Grace Фэн, пожалуйста, см. Мой UPDATE в оригинальном посте. Если я использую 'ContentPresenter', то я могу заставить его работать каждый раз, когда Text Changes отлично. Единственная проблема заключается в том, что если я использую 'VerticalOffset = -100', то текст явно плавает из-за пределов' ContentPresenter', который выглядит странно. – Cleve

+0

@ Cleve, Моя ошибка, я заметил, что вы изменили 'HorizontalOffset' на' VerticalOffset', вы также изменили цель анимации.Я уточню свой ответ позже. –

+0

@ Cleve, я обновил свой ответ, извините за свою ошибку. –

Смежные вопросы