2

トグルすると回転するはずの画像がありますが、代わりにU字型に移動します。言い換えれば、それは角度のある経路、すなわち180度で移動します。

画像を180度回転させる方法は？

以下は透明な画像です。保存して表示できます 回転させたい画像 。ユーザータブが矢印画像上にある場合、テキストを含むテキストブロックが開きます。また、画像は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

さて、あなたは実際にあなたを捨てるためにここで起こっているいくつかのことを持っています。マージンは、回転しているTransformOriginをそのオブジェクトの中心としてスローするように見えます（したがって、中心から外れた回転を取得しているのはなぜですか）。

RenderTransformOrigin（現在壊れてコメントアウトしている）を調整して、これを補正し、オブジェクトの中心を再調整できます。または、回転させたいオブジェクトを押す奇妙なマージンやその他のパーツを修正することもできます。

お役に立てれば。詳細については、詳しく説明してください。（つまり、画像を投稿し、目的を明確に説明すると、より正確な例を提供できます。:)

于 2012-10-04T20:16:11.550 に答える