Rotation pile/face - 2 listview

**Kar2013** · 28/03/2014, 16h02

Bonjour à tous,

Je suis à la recherche d'une solution voir d'un petit exemple pour faire une rotation sur un même axe de 2 listview.
Une cotê pile et l'autre côté face.

Le passage de l'une à l'autre avec un effet rotation 3D sur le même axe.

Il me semble qu'il est possible d'effectuer ce type de traitement avec le WPF.

Avez-vous une idée pour ce cas de figure ?

Merci par avance

**MABROUKI** · 31/03/2014, 00h02

Bonjour

Une rotation 3d n'est possible que dans l'univers 3d...

Viewport3D & son children Viewport2DVisual3D sont faits pour cela
-mapper des controls 2d ordinaires sur une surface 3d en conservant la possibilites d'interaction avec les controls mappes...

voici un exemple que tu pourrais amenager suivant tes besoins:
code behind .cs d'un class data Person & sa collection Persons

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Collections.ObjectModel;
 
namespace WpfApplication1
{
    public class Person
    {
 
        public Person(string n,int num)
        {
            ID = num;
            Name = n;
        }
        private int id;
 
        public int ID
        {
            get { return id; }
            set { id = value; }
        }
        private string name;
 
        public string Name
        {
            get { return name; }
            set { name = value; }
        }
    }
    public class Persons : ObservableCollection<Person>
    {
        Person pp;
        public Persons()
        {
            for (int i = 0; i < 10; i++)
            {
                pp = new Person("item", i + 1);
                this.Add(pp);
 
            }
 
        }
 
    }
}

code xaml usercontrol qui realise la fonctionnalite d'affichage de 2 ListBoxes(recto/verso):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
 
<UserControl x:Class="WpfApplication1.UserControl3"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:local="clr-namespace:WpfApplication1"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <local:Persons x:Key="l"></local:Persons>
        <DataTemplate x:Key="tl1"
                      DataType="{x:Type local:Person}">
            <StackPanel Orientation="Horizontal" >
                <TextBlock FontSize="14" FontWeight="Bold" 
                           Background="Red" Foreground="White"  
                           Text="{Binding ID}"/>
                <TextBlock FontSize="14" FontWeight="Bold" 
                           Background="Red" Foreground="DarkBlue"  
                           Text="{Binding Name}"/>
            </StackPanel>
 
        </DataTemplate>
        <DataTemplate x:Key="tl2"
                      DataType="{x:Type local:Person}">
            <StackPanel Orientation="Horizontal" >
                <TextBlock FontSize="14" FontWeight="Bold" 
                           Background="Red" Foreground="Magenta"  
                           Text="{Binding ID}"/>
                <TextBlock FontSize="14" FontWeight="Bold" 
                           Background="Red" Foreground="Yellow"  
                           Text="{Binding Name}"/>
            </StackPanel>
 
        </DataTemplate>
    </UserControl.Resources>
    <Grid>
        <Viewport3D>
            <Viewport3D.Camera>
                <PerspectiveCamera Position="0, 0, 4"/>
            </Viewport3D.Camera>
            <!-- Button on 3D -->
            <Viewport2DVisual3D>
                <!-- Give the plane a slight rotation -->
                <Viewport2DVisual3D.Transform>
                    <RotateTransform3D>
                        <RotateTransform3D.Rotation>
                            <AxisAngleRotation3D 
                                x:Name="rot"
                                Angle="0" Axis="0, 1, 0" />
                        </RotateTransform3D.Rotation>
                    </RotateTransform3D>
                </Viewport2DVisual3D.Transform>
 
                <!-- The Geometry, Material, and Visual for the Viewport2DVisual3D -->
                <Viewport2DVisual3D.Geometry>
                    <MeshGeometry3D 
                        Positions="-1,1,0 -1,-1,0 1,-1,0 1,1,0"
                        TextureCoordinates="0,0 0,1 1,1 1,0" 
                        TriangleIndices="0 1 2 0 2 3"/>
                </Viewport2DVisual3D.Geometry>
 
                <Viewport2DVisual3D.Material>
                    <DiffuseMaterial
                        Viewport2DVisual3D.IsVisualHostMaterial="True" Brush="White"/>
                </Viewport2DVisual3D.Material>
                <StackPanel 
                    Background="Aquamarine">
                    <ListBox
                        x:Name="lb1"
                        Margin="10" 
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Visibility="Visible" 
                        ItemTemplate="{StaticResource tl1}"
                        ItemsSource="{Binding Source={StaticResource l}}">
                    </ListBox>
                    <TextBlock 
                        Margin="10" 
                        x:Name="tb1"
                        FontSize="16"
                        Foreground="DarkBlue"
                        Text="Recto ->"
                        Visibility="Visible" >
                    </TextBlock>
                    <ListBox
                        x:Name="lb2"
                        Margin="10"
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"
                        Visibility="Collapsed" 
                        ItemTemplate="{StaticResource tl2}"
                        ItemsSource="{Binding Source={StaticResource l}}">
                    </ListBox>
                    <TextBlock 
                        Margin="10" 
                        x:Name="tb2"
                        FontSize="16"
                        Foreground="DarkBlue"
                        Text="Verso ->"
                        Visibility="Collapsed" >
                    </TextBlock>
                    <StackPanel.Triggers>
                        <EventTrigger RoutedEvent="ListBox.MouseEnter">
                            <BeginStoryboard>
                                <Storyboard BeginTime="0:0:1">
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="lb1" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Collapsed}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="lb2" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Visible}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation  
                                        BeginTime="0:0:1"
                                        Storyboard.TargetName="rot"
                                        Storyboard.TargetProperty="Angle"
                                        From="0" To="40">
                                    </DoubleAnimation>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="tb1" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Collapsed}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="tb2" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Visible}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                        <EventTrigger RoutedEvent="ListBox.MouseLeave">
                            <BeginStoryboard>
                                <Storyboard BeginTime="0:0:1">
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="lb2" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Collapsed}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="lb1" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Visible}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation  
                                         BeginTime="0:0:1"
                                        Storyboard.TargetName="rot"
                                        Storyboard.TargetProperty="Angle"
                                        From="0" To="40" 
                                       >
                                    </DoubleAnimation>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="tb2" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Collapsed}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="tb1" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame Value="{x:Static Visibility.Visible}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
                    </StackPanel.Triggers>
                </StackPanel>
            </Viewport2DVisual3D>
 
            <!-- Lights -->
            <ModelVisual3D>
                <ModelVisual3D.Content>
                    <DirectionalLight Color="#FFFFFFFF" Direction="0,0,-1"/>
                </ModelVisual3D.Content>
            </ModelVisual3D>
 
        </Viewport3D>
    </Grid>
</UserControl>

code xaml du simple form utilisateur:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
 
<Window x:Class="WpfApplication1.Window5"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication1"
        Title="Window5" Height="300" Width="300">
    <Grid>
        <local:UserControl3></local:UserControl3>
    </Grid>
</Window>

bon code............

**Kar2013** · 02/04/2014, 13h15

Salut MABROUKI,

Merci beaucoup pour ta réponse, je regarde ça de près et reviens vers toi si nécessaire.

A bientôt

Rotation pile/face - 2 listview

Windows Presentation Foundation

Vue hybride

Discussions similaires

Partager

Partager