Discussion :

[MiniCesc]

Bonjour à tous,

J'ai des petits composants graphiques (des images d'environ 30x30) que je voudrais ajouter dans un composant type ListBox. Seulement le problème c'est que si je prend un ListBox, j'aurai une image par ligne et donc si j'ai beaucoup d'image c'est vite la galère...

Je voulais donc savoir s'il existe un composant, un peu comme un JPanel en Java, auquel on ajoute des éléments et qui, quand on arrive à la largeur max du composant, "retourne à la ligne".

[MiniCesc]

Je crois avoir trouvé une réponse à ma question par le contrôle "WrapPanel"... Je vais faire quelques essais...

[binoo]

Salut, c'est en effet de ce coté qu'il faut regarder. Pour t'aider un peu plus, il faut jouer sur l'ItempPanel :

Code xml :

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

1
2
3
4
5
6
7
<Setter Property="ItemsPanel">
  <Setter.Value>
    <ItemsPanelTemplate>
      <WrapPanel />
    </ItemsPanelTemplate>
  </Setter.Value>
</Setter>

[MiniCesc]

Après une pose déjeuner, tout va mieux
Je viens d'avoir la même idée puisque j'ai trouvé il y a peu la façon d'organiser les éléments d'une ListBox horizontalement :

Code xml :

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

1
2
3
4
5
6
7
8
9
<ListBox ItemsSource="{Binding Models.SelectedModel.Areas}"
         ItemTemplate="{StaticResource areaLegendItem}" 
         VerticalContentAlignment="Top">
       <ListBox.ItemsPanel>
              <ItemsPanelTemplate>
                     <StackPanel Orientation="Horizontal" />
              </ItemsPanelTemplate>
       </ListBox.ItemsPanel>
</ListBox>

Avec un peu de bol ça fonctionnera avec un WrapPanel

[binoo]

Ouep. C'est bien ça .

[MiniCesc]

Après quelques petits tests, ça marche nickel

Par contre j'ai un petit soucis : j'affiche des images dans ma listbox.
Seulement je ne veux pas les afficher en taille réelle, je ne veux afficher que des miniatures. Je crée une liste d'objets "PictureDescVM".

Code C# :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
public class PictureDescVM : ViewModelBase
    {
        private string _path;
        private BitmapSource _bitmapSource;
 
        public PictureDescVM(string path){
            _path = path;
            _bitmapSource = new BitmapImage(new Uri(_path, UriKind.Relative)); ;
        }
 
        public string Path{ get { return _path; } }
 
        public BitmapSource BitmapSource{ get { return _bitmapSource; } }
    }

Je les lie ensuite aux objets de ma ListBox par DataTemplate

Code XML :

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

1
2
3
<DataTemplate x:Key="PictureTemplate">
            <Image Source="{Binding BitmapSource}" Width="20" Height="20" />
        </DataTemplate>

Là dans ma ListBox, j'ai bien plein de carré 20x20 les uns à coté des autres, mais rien dedans... Pas d'erreur dans la sortie de VS, si je met un point d'arrêt sur la propriété "BitmapSource", on passe bien dedans...

Par contre, quand j'accède à "BitmapSource.PixelWidth", l'image s'affiche bien... Du coup je suis obligé de faire mon sioux et de limiter avec MaxWidth :

Code XML :

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

1
2
3
<DataTemplate x:Key="PictureTemplate">
            <Image Source="{Binding BitmapSource}" Width="{Binding BitmapSource.PixelWidth}" Height="20" MaxWidth="20" />
        </DataTemplate>

Si j'essaye de passer "BitmapSource.PixelWidth" dans un convertisseur pour multiplier par 0.5 par exemple, ça me sort 234 (j'ai 234 images...) exceptions dans la console (et on ne passe pas dans la fonction Convert du-dit convertisseur) :

System.Windows.Data Error: 17 : Cannot get 'PixelWidth' value (type 'Int32') from 'BitmapSource' (type 'BitmapImage'). BindingExpressionath=BitmapSource.PixelWidth; DataItem='PictureDescVM' (HashCode=40050212); target element is 'Image' (Name=''); target property is 'Width' (type 'Double') TargetInvocationException:'System.Reflection.TargetInvocationException: Une exception a été levée par la cible d'un appel. ---> System.IO.IOException: Impossible de trouver la ressource 'view/custsymb/r11.bmp'.
à MS.Internal.AppModel.ResourcePart.GetStreamCore(FileMode mode, FileAccess access)
..........

Donc ça marche mais c'est vraiment étrange que je sois obligé d'accéder à PixelWidth pour afficher l'image...