Discussion :

[R00t_infinity]

Bonjour,

j'ai en premier lieu ajouter une nouvelel source de données sous forme de dataset à mon projet, je dispose ainsi d'une table films comprenant un nom, des acteurs, une description et une affiche. j'ai placé un groupbox sur mon form. Je peux glisser-deposer ma source de données dans mon groupbox pour bind les données automatique mais j'aimerais avoir un affichage du style suivant :

Etant débutant en WPF je ne maitrise pas trop l'utilisation du XAML donc si vous pouviez me donner un exemple ou au moins une piste... Sachant que j'aimerais que le clic sur un groupe affiche/titre ouvre un second form avec des textblock contenant cette fois toutes les infos du dit film.
Merci d'avance.

[ikeas]

utilise un wrap panel
et en cliquant sur ton image on tombe ... sur un truc de cul lol

[R00t_infinity]

Ok je vais regarder du côté du wrap panel.

Oui j'ai remarqué aussi, allez savoir pourquoi -_-

[ikeas]

pour preciser tu met un wrappanel comme ceci

<ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
</ListBox>

et je te suggere aussi d'utiliser un datatemplate pour tes items

[R00t_infinity]

J'ai essayé de faire un truc du style, cependant le DataTemplate doit être mal fait car j'ai une erreur à al compilation quand je le met. En même temps j'en ai jamais fait ca doit pas aider ^^ :

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
<GroupBox Header="GroupBox" HorizontalAlignment="Left" Height="133" Margin="160,151,0,0" VerticalAlignment="Top" Width="347">
            <ListBox ItemsSource="{Binding}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel HorizontalAlignment="Left" Height="111" VerticalAlignment="Top" Width="335" />
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
                <DataTemplate>
                    <Grid Margin="4">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="auto" />
                            <RowDefinition Height="30" />
                        </Grid.RowDefinitions>
                        <Image Source="{Binding Image}" />
                        <Label Content="{Binding Titre}" />
                    </Grid>
                </DataTemplate>
            </ListBox>
 
 
        </GroupBox>

[ikeas]

oui en effet ca marche pas comme ca
bon pour faire simple

tu laisse ca

<ListBox ItemsSource="{Binding}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel HorizontalAlignment="Left" Height="111" VerticalAlignment="Top" Width="335" />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>

et ce que tu fais pour le data template c'est de l'assossier au type de ton objet soit tu le colle dans window.resource comme ceci

<Window.Resources>
<DataTemplate DataType="{x:Type local:Alert}">
<Border BorderBrush="#FFABABAB"
BorderThickness="2"
Margin="3"
Padding="2"
CornerRadius="3">
<DockPanel>
<Button x:Name="btDelAlert"
HorizontalAlignment="Right"
DockPanel.Dock="Right"
Width="30"
Visibility="{Binding NotDelete, Converter={StaticResource notdelete}}"
Foreground="Black"
Click="btDelAlert_Click"
VerticalAlignment="Stretch"
Style="{DynamicResource ButtonNone}"
ToolTip="Effacer cette alerte">
<Image Source="/TimeCounter;component/images/annuler.png" />
</Button>
......

soit tu le colle dans listbox.resources comme cela

HorizontalContentAlignment="Stretch">
<ListBox.Resources>
<local:NotDeleteConverter x:Key="notdelete" />
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"
Color="Transparent" />
<SolidColorBrush x:Key="{x:Static SystemColors.ControlBrushKey}"
Color="Transparent" />
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightTextBrushKey}"
Color="Black" />
<Storyboard x:Key="ShowError">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)"
Storyboard.TargetName="Error">
<EasingDoubleKeyFrame KeyTime="0:0:2"
Value="1" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>

<DataTemplate DataType="{x:Type local:Alert}">
<Border BorderBrush="#FFABABAB"
BorderThickness="2"
Margin="3"
Padding="2"
CornerRadius="3">
<DockPanel>
<Button x:Name="btDelAlert"
HorizontalAlignment="Right"
DockPanel.Dock="Right"
Width="30"
Visibility="{Binding NotDelete, Converter={StaticResource notdelete}}"
Foreground="Black"
Click="btDelAlert_Click"
VerticalAlignment="Stretch"
Style="{DynamicResource ButtonNone}"
ToolTip="Effacer cette alerte">
<Image Source="/TimeCounter;component/images/annuler.png" />
</Button>
<TextBlock TextWrapping="Wrap"
VerticalAlignment="Center"
FontSize="26"
Margin="5,0,0,0"
Text="{Binding TimeAlert}"
FontFamily="/#Digital-7 Mono"
HorizontalAlignment="Left" />
</DockPanel>
</Border>
</DataTemplate>

regarde un peut les datatemplate c vraiment sympa, moi j'ai fait une appli rien qu'avec ca (pour rigoler)

le groupe box est evidement dans le template lol