如何在Windows Phone應用程序列表視圖中並排排列兩個圖像

Question

我正在開發windows應用程序，在這個應用程序中我想使用列表視圖控件並排排列兩個圖像。其實發生的事情是我在listview中綁定圖像，但圖像綁定在另一個圖像下面的一個圖像是綁定的。如何在列表視圖中排列圖像，以及如何在所有分辨率屏幕中設置圖像的寬度。請幫助我。

以下是我的示例代碼。

<ListView x:Name="listviewfreecredits" Margin="0,-1,0.643,10" Height="521" IsItemClickEnabled="True" ItemClick="listviewfreecredits_ItemClick"> 

         <ListView.ItemTemplate> 
          <DataTemplate> 
           <StackPanel > 
            <Grid Margin="10,10,50,10" Width="389" > 


             <Image Source="{Binding DealImage}" Stretch="None" Width="400" Height="300" /> 


            </Grid> 
           </StackPanel> 
          </DataTemplate> 
         </ListView.ItemTemplate> 
        </ListView> 


    string result = ""; 

       HttpWebRequest request = HttpWebRequest.Create(Url.weburl + "FreeCredits_v2?PlatFormID=7") as HttpWebRequest; 
       request.Method = "GET"; 


       WebResponse response = await request.GetResponseAsync(); 
       using (var reader = new StreamReader(response.GetResponseStream())) 
       { 
        result = reader.ReadToEnd(); 
        // Do anything with you content. Convert it to xml, json or anything. 
       } 


       JObject jobj = JObject.Parse(result); 
       JArray jarr = (JArray)jobj["Deals"]; 
       if (jarr != null) 
       { 
        for (int i = 0; i < jarr.Count; i++) 
        { 
         string DealImage = (string)jarr[i]["DealImage"]; 
         string DealID = (string)jarr[i]["DealID"]; 
         string Buttontext = (string)jarr[i]["Buttontext"]; 

         freecredit obj = new freecredit(); 
         obj.DealImage = Url.imgurl + DealImage; 
         obj.DealID = DealID; 
         obj.ButtonText = Buttontext; 
         this.listviewfreecredits.Items.Add(obj); 

        } 

Answer 1

使用GridView控件，而不是ListView控件，併爲寬度就可以計算出它在圖像控件綁定寬度和高度，像高每個圖像。例如

<GridView x:Name="listviewfreecredits" Margin="0,-1,0.643,10" Height="521" IsItemClickEnabled="True" ItemClick="listviewfreecredits_ItemClick"> 

        <GridView.ItemTemplate> 
         <DataTemplate> 
          <StackPanel > 
           <Grid Margin="10,10,50,10" Width="389" > 


            <Image Source="{Binding DealImage}" Stretch="None" Width="{Bind ImageWidth}" Height="{Bind ImageWidth}" /> 


           </Grid> 
          </StackPanel> 
         </DataTemplate> 
        </GridView.ItemTemplate> 
       </GridView> 

for (int i = 0; i < jarr.Count; i++) 
       { 
        string DealImage = (string)jarr[i]["DealImage"]; 
        string DealID = (string)jarr[i]["DealID"]; 
        string Buttontext = (string)jarr[i]["Buttontext"]; 

        freecredit obj = new freecredit(); 
        obj.DealImage = Url.imgurl + DealImage; 
        obj.DealID = DealID; 
        obj.ButtonText = Buttontext; 
        //set image width, height by calculating with height accordingly 
        obj.ImageWidth = ((Windows.UI.Xaml.Window.Current.Bounds.Width - 50/ 2); 
        this.listviewfreecredits.Items.Add(obj); 

       } 

定義ImageWidth財產作爲雙在freecredit類