none
Metro C# GridView 任意角度显示图片 RRS feed

  • 问题

  • GridView加载图片时  图片以任意的随机角度显示(每张图片都是随机的角度)     求解


    Mr Lou

    2012年8月29日 5:34

答案

  • 用RenderTransform + RotateTransform

    你的GridView 的 ItemTemplate 中的Image 组件加上 RotateTransform 的设置,然后他的 Angle 属性设置为随机的角度既可显示为任意随机角度。

            <GridView ItemsSource="{Binding}">
                <GridView.ItemTemplate>
                    <DataTemplate>
                        <Image Source="{Binding ImagePath}" Width="300" Height="300"
                               RenderTransformOrigin="0.5,0.5">
                            <Image.RenderTransform>
                                <RotateTransform Angle="{Binding Angle}"/>
                            </Image.RenderTransform>
                        </Image>
                    </DataTemplate>
                </GridView.ItemTemplate>
            </GridView>

    C#:
        public sealed partial class MainPage : Page
        {
            public MainPage()
            {
                this.InitializeComponent();
                this.DataContext = new List<Item>()
                {
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item()
                };
            }
        }
        public class Item
        {
            public string ImagePath { get { return "Assets/Logo.png"; } }
            public double Angle
            {
                get
                {
                    Random random = new Random(DateTime.Now.Millisecond);
                    return random.Next(0, 180);
                }
            }
        }


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    • 已标记为答案 Mr Lou 2012年8月30日 4:16
    2012年8月30日 3:45
    版主

全部回复

  • 用RenderTransform + RotateTransform

    你的GridView 的 ItemTemplate 中的Image 组件加上 RotateTransform 的设置,然后他的 Angle 属性设置为随机的角度既可显示为任意随机角度。

            <GridView ItemsSource="{Binding}">
                <GridView.ItemTemplate>
                    <DataTemplate>
                        <Image Source="{Binding ImagePath}" Width="300" Height="300"
                               RenderTransformOrigin="0.5,0.5">
                            <Image.RenderTransform>
                                <RotateTransform Angle="{Binding Angle}"/>
                            </Image.RenderTransform>
                        </Image>
                    </DataTemplate>
                </GridView.ItemTemplate>
            </GridView>

    C#:
        public sealed partial class MainPage : Page
        {
            public MainPage()
            {
                this.InitializeComponent();
                this.DataContext = new List<Item>()
                {
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item(),
                    new Item()
                };
            }
        }
        public class Item
        {
            public string ImagePath { get { return "Assets/Logo.png"; } }
            public double Angle
            {
                get
                {
                    Random random = new Random(DateTime.Now.Millisecond);
                    return random.Next(0, 180);
                }
            }
        }


    Bob Bao [MSFT]
    MSDN Community Support | Feedback to us

    • 已标记为答案 Mr Lou 2012年8月30日 4:16
    2012年8月30日 3:45
    版主
  • 你好! Bob Bao  根据你的代码 终于实现任意旋转了  非常感谢


    Mr Lou

    2012年8月30日 4:17