问题描述
我是通用应用程序开发的新手,我有一个每页有 4 个按钮的翻转视图,每个按钮都有一个图像(总共 8 个图像),我创建了一个包含图像列表及其 URls 的模型类:
I am new in universal app developpment,I have a flipview with 4 buttons in each page,each button has an image(8 images in total),I have created a model class that contains the list of images and their URls:
public class SampleItem
{
public string Image1 { get; set; }
public string Image2 { get; set; }
public string Image3 { get; set; }
public string Image4 { get; set; }
public string Image5 { get; set; }
public string Image6 { get; set; }
public string Image7 { get; set; }
public string Image8 { get; set; }
}
public class ButtonImages
{
public List<SampleItem> SampleItems { get; set; }
public ButtonImages()
{
SampleItems = new List<SampleItem>();
SampleItems.Add(new SampleItem()
{
Image1 = "images/1.png"
});
SampleItems.Add(new SampleItem()
{
Image2 = "images/2.png"
});
SampleItems.Add(new SampleItem()
{
Image3 = "images/3.png"
});
...........//all the 8 images URIs
然后我定义名为flipview1的我的flipview:
then I define my flipview named flipview1:
<Page.Resources>
<DataTemplate x:Key="FlipViewItemTemplate">
<Grid >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Button Grid.Column="0" Grid.Row="0" >
<Image Source="{Binding Image1}"/>
</Button>
<Button Grid.Column="1" Grid.Row="0">
<Image Source="{Binding Image2}" />
</Button>
<Button Grid.Column="0" Grid.Row="1">
<Image Source="{Binding Image3}"/>
</Button>
<Button Grid.Column="1" Grid.Row="1">
<Image Source="{Binding Image4}"/>
</Button>
</Grid>
</DataTemplate>
</Page.Resources>
<FlipView x:Name="flipView1" ItemTemplate="{StaticResource FlipViewItemTemplate}"/>
这是我尝试获取 8 个图像并将它们放在每个页面中的每个 4 个按钮中:
and this is my try to get the 8 images and put them in each 4 buttons,in each page:
private void getimages()
{
List<ButtonImages> T = new List<ButtonImages>();
ButtonImages a;
if(true)
{
a = new ButtonImages();
T.Add(a);
}
flipView1.ItemsSource = T;
}
但我有 8 页,每页有 4 个按钮,每页一个按钮有一个图像,其他按钮是空的 :(
but I get 8 pages,each page has 4 buttons,in each page one button has an image an the others are empty :(
我已经调试了代码,并且我将 T 中的所有图像作为列表你有什么想法我该如何更正代码
I have debug the code,and I get all images in T as a listhave you please any idea how can I correct the code
感谢帮助
推荐答案
首先,如果您希望每个 FlipView 页面有 4 个图像,您的 SampleItem
应该包含 4 个图像路径:
Firstly if you want 4 images per FlipView page your SampleItem
should contains 4 path to images:
public class SampleItem
{
public string Image1 { get; set; }
public string Image2 { get; set; }
public string Image3 { get; set; }
public string Image4 { get; set; }
}
其次,如果您想要 2 个包含 4 个图像的页面,您应该使用 SampleItem
Secondly if you want 2 pages with 4 images you should create list with 2 objects of SampleItem
var page1 = new SampleItem()
{
Image1 = "images/bar.png",
Image2 = "images/cuisine.png",
Image3 = "images/events.png",
Image4 = ""//path to 4th image on 1st page
};
var page2 = new SampleItem()
{
Image1 = "",//path to 1st image on 2nd page,
Image2 = "",//path to 2nd image on 2nd page,
Image3 = "",//path to 3rd image on 2nd page,
Image4 = ""//path to 4th image on 2nd page
};
var pages = new List<SampleItem>()
{
page1,
page2
};
最后你应该为你的 FlipView 设置 ItemsSource
And finally you should set ItemsSource for your FlipView
flipView1.ItemsSoruce = pages;
您的代码无法正常工作,因为您创建了包含 8 个元素的列表,并且每个元素都只设置了一个 Image 属性.这就是为什么您得到 8 页而只显示一张图片的原因.
Your code was not working properly because you created list with 8 elements and every element has only one of Image property set. That's why you get 8 pages and only one image was displays.
顺便说一句,我已经回答了非常相似的问题(我认为这是你的问题)通用 Windows 应用中的翻转视图
Btw I already answered for very similar question (I think its yours one) flipview in a universal windows app
这篇关于在 FlipView Windows 应用商店中的按钮中绑定图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!