2

我有一个应该在切换时旋转的图像，但它会以 u 形移动。换句话说，它以一个角度路径移动，即 180 度。

如何将图像旋转 180 度？

下面是透明的图像，您可以将其保存以查看它： 我想旋转的图像 我有一个 longlistselector 当用户选项卡在箭头图像上时，它将打开包含文本的文本块，并且图像必须旋转 180 即箭头必须向上指向运动就像 wphone7 主屏幕上的箭头一样。

我的页面资源

<phone:PhoneApplicationPage.Resources>
        <local:ValueConverterBoolToVis x:Key="ValueConverterBoolToVis" />

        <Style TargetType="ToggleButton" x:Key="FlipButton">

            <Setter Property="Template">
                <Setter.Value>

                    <ControlTemplate TargetType="ToggleButton">
                        <Grid>
                            <VisualStateManager.VisualStateGroups>

                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">

                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:5"   Storyboard.TargetName="rotate"  Storyboard.TargetProperty="(RotateTransform.Angle)" To="180" />

                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:5"   Storyboard.TargetName="rotate" Storyboard.TargetProperty="(RotateTransform.Angle)" To="0" />
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <!--RenderTransformOrigin="0.5,0.5"-->
                            <ContentPresenter  Content="{TemplateBinding Content}">
                                <ContentPresenter.RenderTransform>

                                    <RotateTransform x:Name="rotate" CenterX="0.5" CenterY="0.5" />

                                </ContentPresenter.RenderTransform>
                            </ContentPresenter>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>


        <!-- The template for the list header. This will scroll as a part of the list. -->
        <DataTemplate x:Key="citiesListHeader">
            <Border Background="Purple">
                <TextBlock Text="Cities Header" />
            </Border>
        </DataTemplate>
        <DataTemplate x:Key="citiesListFooter">
            <Border Background="Green">
                <TextBlock Text="Cities Footer" />
            </Border>
        </DataTemplate>

        <!-- The template for city items -->
        <DataTemplate x:Key="citiesItemTemplate">
            <StackPanel Grid.Column="1"  VerticalAlignment="Top">               
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition  />
                        <ColumnDefinition  />
                        <ColumnDefinition  />                                              
                    </Grid.ColumnDefinitions>    
                    <Grid.RowDefinitions>                   
                        <RowDefinition/>
                        <RowDefinition />
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Column="0" Height="50" Tap="ProgLngGropus_Tap" Text="{Binding Name}" FontSize="26"  Margin="12,-5,12,6"/>                   
                    <ToggleButton Grid.Column="2" x:Name="MyToggleButton" Style="{StaticResource FlipButton}">
                        <ToggleButton.Content>
                            <Image Grid.Column="2" Margin="0,-10,-33,0" Height="40" Width="40" x:Name="ArrowDownImg"  Source="/Images/appbar.arrow.down.circle.rest.png" />                            
                        </ToggleButton.Content>
                    </ToggleButton>
                    <TextBlock TextWrapping="Wrap" Text="{Binding Lang}" Grid.Column="0" Grid.Row="1" x:Name="Desc"
                       Foreground="Orange" Visibility="{Binding ElementName=MyToggleButton,
                        Path=IsChecked, Converter={StaticResource ValueConverterBoolToVis}}">                        
                    </TextBlock>

                </Grid>

            </StackPanel>
        </DataTemplate>      
    <DataTemplate x:Key="groupHeaderTemplate">
        <Border Background="YellowGreen" Margin="6">
            <TextBlock Text="{Binding Title}" FontSize="40" Foreground="Black"/>
        </Border>
    </DataTemplate>

    <DataTemplate x:Key="groupItemTemplate" >
        <Border Background="YellowGreen" Width="99" Height="99" Margin="6">
            <TextBlock Text="{Binding Title}" FontSize="40" Foreground="Black"/>
        </Border>
    </DataTemplate>
    </phone:PhoneApplicationPage.Resources>

还有我的网格

<Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="ApplicationTitle" Text="g" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="g" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <toolkit:LongListSelector x:Name="Gropus" Background="Transparent"

                                  ItemTemplate="{StaticResource citiesItemTemplate}" 
                                  GroupHeaderTemplate="{StaticResource groupHeaderTemplate}" 
                                  GroupItemTemplate="{StaticResource groupItemTemplate}" >
                <toolkit:LongListSelector.GroupItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:WrapPanel/>
                    </ItemsPanelTemplate>
                </toolkit:LongListSelector.GroupItemsPanel>
            </toolkit:LongListSelector>


        </Grid>
    </Grid>
4

1 回答 1

2

好的，所以你实际上有一些事情发生在这里让你失望。看来您的 Margin 将摆脱您正在旋转的 TransformOrigin 作为该对象的中心（因此为什么您要偏离中心旋转。）

您可以调整您的 RenderTransformOrigin（您目前已将其中断并注释掉）来弥补这一点，以重新对齐您的对象中心。或者你可以修复你奇怪的边距和任何其他推动你想要旋转的对象的部分。

希望这可以帮助。如果您想了解更多信息，请详细说明。（即；张贴您的图片，清楚地说明您的目标，并且可以提供更准确的示例。:)

于 2012-10-04T20:16:11.550 回答