动态创建按钮列表并在其中传递数据
本文关键字:数据 在其中 创建 按钮 列表 动态 | 更新日期: 2023-09-27 18:30:21
我是C#的新手,我自学C#。我正在尝试在 C# XAML 中创建我的第一个 win8 应用商店应用程序。该应用仅供我使用,不会发布到应用商店。该应用程序网络抓取一个网站,并从中收集一些链接及其描述并填充列表。该列表包含链接和说明,如下所示:链接: www.google.com描述: 谷歌
链接: www.yahoo.com描述: 雅虎
我的第一个问题是我不明白如何将此数据传递到 XAML 页面。我的另一个问题是如何创建一个动态按钮列表,所以如果我的列表有 10 个元素,我希望 XAML 页面上有 10 个按钮。如果我的列表有 5 个元素,我希望 XAML 页面上有 5 个按钮。每个按钮都必须将其内容设置为我的列表中的描述。当我单击一个按钮时,我想传递属于说明的链接并打开另一个 XAML 页面,我可以在其中使用该链接并对其进行操作。
我的 MainPage.xaml.cs 看起来像这样:
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
public sealed partial class MainPage : Page
{
public ObservableCollection<MyApp.HtmlParser.LinkItem> LinkItems { get; set; }
public MainPage()
{
this.InitializeComponent();
}
/// <summary>
/// Invoked when this page is about to be displayed in a Frame.
/// </summary>
/// <param name="e">Event data that describes how this page was reached. The Parameter
/// property is typically used to configure the page.</param>
protected async override void OnNavigatedTo(NavigationEventArgs e)
{
HtmlParser pars = new HtmlParser();
pars.Uri = "http://some website.something/";
//LinksItems = await pars.Parse();
ObservableCollection<MyApp.HtmlParser.LinkItem> LinksItem = await pars.Parse();
ListLinks.DataContext = LinkItems;
}
}
}
我的 HtmlParser 类如下所示:
{
class HtmlParser
{
private string sUri;
public string Uri
{
get { return this.sUri; }
set { this.sUri = value; }
}
public class LinkItem
{
public string link { get; set; }
public string description { get; set; }
public LinkItem(string Link, string Description)
{
this.link = Link;
this.description = Description;
}
}
public HtmlParser()
{
this.sUri = string.Empty;
}
public async Task<ObservableCollection<LinkItem>> Parse()
{
ObservableCollection<LinkItem> listDesc = new ObservableCollection<LinkItem>();
// Initialize http client.
HttpClient httpClient = new HttpClient();
var message = new HttpRequestMessage(HttpMethod.Get, this.sUri);
message.Headers.Add("User-Agent", "Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; WOW64; Trident/6.0)");
var response = await httpClient.SendAsync(message);
var result = response.Content.ReadAsStringAsync().Result;
HtmlAgilityPack.HtmlNode.ElementsFlags.Remove("option");
HtmlDocument document = new HtmlDocument();
document.LoadHtml(result);
//pars web page
//var options = document.DocumentNode.Descendants("option").Skip(1)
// .Select(n => new
// {
// Value = n.Attributes["value"].Value,
// Text = n.InnerText
// })
// .ToList();
//pars mobile web page
var options = document.DocumentNode.Descendants("a").Skip(1)
.Select(n => new
{
Value = n.Attributes["href"].Value,
Text = n.InnerText,
})
.ToList();
foreach (var e in options)
{
// Add results to list:
listDesc.Add(new LinkItem( "http://mobile.blitz-cinestar.hr/" + e.Value, e.Text));
}
return listDesc;
}
}
}
我的 XAML 如下所示
<Page
x:Class="MyApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MyApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<ListView x:Name="ListLinks" ItemsSource="{Binding}"
HorizontalAlignment="Left" Height="495" VerticalAlignment="Top" Width="382">
</ListView>
对不起,我的英语不好。
您可能应该将MyList
重命名为LinkItem
,其中包含链接及其描述;
- 添加类型为
ObservableCollection<LinkItem>
的属性并填充它(在此示例中,将其命名为MyLinks
)- 将
ListView
添加到您的主页.xaml - 将列表视图的
ItemsSource
属性设置为{Binding MyLinks}
。到目前为止,您应该有一个列表视图,显示每个项目的"MyAppNamespace.LinkItem"字符串 - 为每个链接项创建一个
ItemTemplate
,在其中显示一个按钮并将其Content
属性设置为{Binding Description}
- 为
Click
事件创建处理程序
我希望这足以让你走上正确的道路。此外,您可能应该从学习一些 Windows 8 教程开始,以更好地掌握其中的一些概念。
编辑
你没有正确遵循我的指示..试试这个:将一个属性添加到您的主页,并用 LinkItem
s 填充该属性:
public sealed partial class MainPage : Page
{
ObservableCollection<LinkItem> LinkItems {get; set;} // <---------
public MainPage()
{
this.InitializeComponent();
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
HtmlParser pars = new HtmlParser();
pars.Uri = "http://some website.something/";
LinksItems = await pars.Parse(); //<-------------
}
}
使解析器返回填充的集合:
public async Task<ObservableCollection<LinkItem>> Parse()
{
ObservableCollection<LinkItem> listDesc = new ObservableCollection<LinkItem>();
//...
return listDesc;
}
将绑定更改为LinkItems
(上面创建的集合的名称):
<ListView x:Name="ListLinks" ItemsSource="{Binding LinkItems}"
HorizontalAlignment="Left" Height="495" VerticalAlignment="Top" Width="382">
</ListView>