Discussion :

[budocay]

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 ^^

[DotNET74]

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.

[MABROUKI]

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...

[budocay]

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

[DotNET74]

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 ?

[budocay]

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 ^^

[DotNET74]

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