1. #1
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    mai 2015
    Messages
    43
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : mai 2015
    Messages : 43
    Points : 41
    Points
    41

    Par défaut Afficher image côte a côte en UWP

    Bonjour,

    Je travail actuellement sur l'implementation de l'API Flickr en UWP.

    Je rencontre un soucis, je n'arrive pas a afficher mes images récupérers au format JSON et convertis en BitMapImage, côte-à-côte, j'ai essayé avec différentes
    techniques comme les StackPanels, Canva, ListView mais rien a y faire j'essaye encore de trouver mais je en trouve pas quelque chose de convenable au niveau de l'affichage.

    Auriez-vous une piste a me donner ?

    Voici le code C#:
    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
     
     public sealed partial class MainPage : Page
        {
            private FlickrAuth flickr;
            public ObservableCollection<BitmapImage> ImgList = new ObservableCollection<BitmapImage>();
     
            public MainPage()
            {
                InitializeComponent();
            }
     
            private async void Flickr_Log_Click(object sender, RoutedEventArgs e)
            {
                flickr = new FlickrAuth();
                string output;
                var FlickrUri = new Uri(await flickr.GetLonginLink());
                var webAuthenticationResult = await WebAuthenticationBroker.AuthenticateAsync(
                    WebAuthenticationOptions.None,
                    FlickrUri, new Uri("http://www.example.com/"));
                if (webAuthenticationResult.ResponseStatus == WebAuthenticationStatus.Success)
                {
                    output = webAuthenticationResult.ResponseData;
                    await flickr.GetAccessToken(output);
                    await flickr.FlickrOAuthRequest();
                    var res = await flickr.getPublicPhoto();
                    DownloadImageFlickr(res);
                }
                else if (webAuthenticationResult.ResponseStatus == WebAuthenticationStatus.ErrorHttp)
                {
                    output = "HTTP Error returned by AuthenticateAsync() : " + webAuthenticationResult.ResponseErrorDetail;
                }
                else if (webAuthenticationResult.ResponseStatus == WebAuthenticationStatus.UserCancel)
                {
                    output = "Authentication process was cancelled by the user";
                }
            }
     
            private void DownloadImageFlickr(FlickrAuth.RootObject root)
            {
                if (root.stat == "ok")
                {
                    int i = 0;
                    foreach (var VARIABLE in root.photos.photo)
                    {
                        var photoUrl = "http://farm{0}.staticflickr.com/{1}/{2}_{3}_n.jpg";
     
                        var baseFlickrURL = string.Format(photoUrl, VARIABLE.farm, VARIABLE.server, VARIABLE.id,
                            VARIABLE.secret);
                        var bitmapImage = new BitmapImage(new Uri(baseFlickrURL)) {DecodePixelHeight = 100, DecodePixelWidth = 100};
                        ImgList.Add(bitmapImage);
     
                    }
                }
            }
     
            private BitmapImage ImageSource { get; set; }
        }
    Voici le code XAML:
    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
     
    <Page
        x:Class="Epicture.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:Epicture"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d">
     
        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
            <Button x:Name="Flickr_Log" Content="Flickr" HorizontalAlignment="Left" Margin="80,48,0,0"
                    VerticalAlignment="Top" Height="106" Width="291" Click="Flickr_Log_Click" />
            <Button x:Name="Bouton_ImGur" Content="ImGur" HorizontalAlignment="Left" Margin="1288,48,0,0"
                    VerticalAlignment="Top" Height="106" Width="329" />
            <ListView ItemsSource="{x:Bind ImgList}" Margin="35,159,38,-159">
                <ListView.ItemTemplate>
                    <DataTemplate x:DataType="BitmapImage">
     
                        <StackPanel Orientation="Horizontal">
                            <Image Source="{x:Bind }"/>
                        </StackPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>
    </Page>
    Actuellement j'utilise une ListView mais il y a peut-être autre chose que vous pourriez me conseiller ^^

  2. #2
    Membre expérimenté Avatar de DotNET74
    Homme Profil pro
    Watch R&D Engineer & Apprenti .NET
    Inscrit en
    août 2003
    Messages
    1 966
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Watch R&D Engineer & Apprenti .NET

    Informations forums :
    Inscription : août 2003
    Messages : 1 966
    Points : 1 446
    Points
    1 446

    Par défaut

    Hello,

    si tu regardes du côté du UWP ToolKit il y a le composant Adaptative Grid View.

    https://blogs.windows.com/buildingap...GDZpV8xqHGI.97

    peut-être qu'il te permettra de faire ce que tu veux.
    La Théorie c'est quand on comprends tout mais que rien ne fonctionne.
    La Pratique c'est quand tout fonctionne mais qu'on ne sait pas pourquoi !

    Si vous aimez ma réponse, cliquez sur la main verte Merci

  3. #3
    Membre expert
    Inscrit en
    avril 2008
    Messages
    1 980
    Détails du profil
    Informations personnelles :
    Âge : 58

    Informations forums :
    Inscription : avril 2008
    Messages : 1 980
    Points : 3 404
    Points
    3 404

    Par défaut

    bonjour

    Le plus souple c'est un WrapPanel comme Panel Host ...
    Car le Panel Host par défaut des ItemsControl est un StackPanel .....
    code xaml exemple:

    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
     
     
    <Grid>
            <ListView  
                BorderThickness="0"   
                ItemsSource="{Binding  ImgList }" Background="{x:Null}">
                <ListView.ItemTemplate>
                    <DataTemplate DataType="{x:Type BitmapImage}">
                            <Image Source="{Binding }"/>
                    </DataTemplate>
                </ListView.ItemTemplate>
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate >
                        <WrapPanel IsItemsHost="true" VirtualizingStackPanel.VirtualizationMode="Recycling" />
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
     
            </ListView>
        </Grid>
    bon code...

  4. #4
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    mai 2015
    Messages
    43
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : mai 2015
    Messages : 43
    Points : 41
    Points
    41

    Par défaut

    Je vous remercie, j'ai regardé du côté de la GridView et sa marche pas mal sauf quand je veux selctionner mes éléments, impossible de retrouver les datas en rapport avec mon image.
    Je vais continuer a chercher en tout cas merci je continue a regarder

  5. #5
    Membre expérimenté Avatar de DotNET74
    Homme Profil pro
    Watch R&D Engineer & Apprenti .NET
    Inscrit en
    août 2003
    Messages
    1 966
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Watch R&D Engineer & Apprenti .NET

    Informations forums :
    Inscription : août 2003
    Messages : 1 966
    Points : 1 446
    Points
    1 446

    Par défaut

    Hello,
    si tu utilises la propriété ItemsSource, tu dois pouvoir via l'évènnements ItemClickCommand récupérer les données.

    As-tu regardé pour la propriété SelectedItem ?
    La Théorie c'est quand on comprends tout mais que rien ne fonctionne.
    La Pratique c'est quand tout fonctionne mais qu'on ne sait pas pourquoi !

    Si vous aimez ma réponse, cliquez sur la main verte Merci

  6. #6
    Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    mai 2015
    Messages
    43
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 21
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : mai 2015
    Messages : 43
    Points : 41
    Points
    41

    Par défaut

    Citation Envoyé par DotNET74 Voir le message
    Hello,
    si tu utilises la propriété ItemsSource, tu dois pouvoir via l'évènnements ItemClickCommand récupérer les données.

    As-tu regardé pour la propriété SelectedItem ?
    Oui j'ai regardé de ce côté la, leurs samples sont très bien pour comprendre comment ça marche mais je me heurte a la problèmatique suivante en fait:

    Comment faire pour que les images que je vais récupérer de Flickr soient bien set dedans, car aujourd'hui j'utilise une Observable Collection de BitmapImage et c'est pas compatible avec la GridView de UWPToolKit en fait
    ou alors je m'en sert très mal ^^

  7. #7
    Membre expérimenté Avatar de DotNET74
    Homme Profil pro
    Watch R&D Engineer & Apprenti .NET
    Inscrit en
    août 2003
    Messages
    1 966
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Watch R&D Engineer & Apprenti .NET

    Informations forums :
    Inscription : août 2003
    Messages : 1 966
    Points : 1 446
    Points
    1 446

    Par défaut

    Je ne comprends pas bien ton soucis à ce stade ...

    tu télécharges tes images et les stockes en locales temporairement et tu les charges ensuite ...

    tu fais bien comme ça ?

    https://github.com/Microsoft/UWPComm...dViewPage.xaml
    La Théorie c'est quand on comprends tout mais que rien ne fonctionne.
    La Pratique c'est quand tout fonctionne mais qu'on ne sait pas pourquoi !

    Si vous aimez ma réponse, cliquez sur la main verte Merci

Discussions similaires

  1. Images (ou objets) côte à côte
    Par Mister Nono dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 15/01/2007, 17h01
  2. Réponses: 2
    Dernier message: 17/02/2006, 14h26
  3. Réponses: 9
    Dernier message: 27/01/2006, 19h00
  4. Afficher image stockée sous forme binaire
    Par Luffy Duck dans le forum PHP & MySQL
    Réponses: 10
    Dernier message: 26/12/2005, 19h30
  5. afficher image
    Par sanosuke dans le forum Bases de données
    Réponses: 1
    Dernier message: 19/10/2004, 10h43

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo