如何将数据绑定到Xaml,Windows Phone? [英] How can I bind data into Xaml, Windows Phone?
问题描述
这是我的C#代码,现在它在控制台中显示数据。
This is my C# code, now it's showing data in console.
class PlaceViewModel
{
public List<Vantaa.IntroPage.Place> Places;
}
public class Place
{
public string id { get; set; }
public string title { get; set; }
public string latitude { get; set; }
public string longitude { get; set; }
public string www { get; set; }
}
public class RootObject
{
public List<Place> Places { get; set; }
}
protected override void OnNavigatedTo(NavigationEventArgs e)
{
WebClient webClient = new WebClient();
webClient.DownloadStringCompleted += new DownloadStringCompletedEventHandler(webClient_DownloadStringCompleted);
webClient.DownloadStringAsync(new Uri("http://mobiilivantaa.lightscreenmedia.com/api/place"));
}
private void webClient_DownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
var rootObject = JsonConvert.DeserializeObject<RootObject>(e.Result);
foreach (var book in rootObject.Places)
{
System.Diagnostics.Debug.WriteLine(book.id);
}
this.DataContext = new PlaceViewModel
{
Places = rootObject.Places
};
}
为了在textblock中显示数据,我应该如何处理xaml文件?
What should I do with xaml file in order to show the data in textblock ?
这是我目前的xaml代码。这肯定不行。我真的不知道。
This is my current xaml code. It's surely not working. I really have no idea.
<ListBox ItemsSource="{Binding Places}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding Path=id}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
推荐答案
你的类代码看起来不错,现在只是一个将结果束缚于观点的事项。您正在返回对象列表,因此您应该使用支持显示多个项目的控件。当然,您可以将所有图书的id连接到一个字符串,并将其显示在标签中。但这不是怎么做的。您应该做的是将一个ListBox控件添加到XAML并在其中创建一个DataTemplate。这样,您可以设置项目的显示方式。
Your class-code looks good so now it's just a matter of binding the results to the view. You are returning a list of objects so you should use a control that supports showing multiple items. Of course you could concatenate all the id's of the books to one string and show it in a label. But this is not how it's done. What you should do is add a ListBox control to the XAML and create a DataTemplate inside it. This way you set the way items will be displayed.
创建一个类,将作为您的XAML页面的ViewModel。该类将具有属性地方(类型:列表< Place>
)。在获取所有数据完成后的OnNavigatedTo事件中,填写ViewModel并将其绑定到XAML的DataContext:
Create a class that will be the ViewModel for your XAML-page. This class will have a property 'Places' (type: List<Place>
). In the OnNavigatedTo-event when getting all the data is done, fill the ViewModel and bind and bind it to the DataContext of the XAML:
this.DataContext = new YourViewModel { Places = rootObject.Places };
这样可以从XAML中的ViewModel中获取所有对象:
This way you can grab all the objects from the ViewModel in your XAML:
<ListBox ItemsSource="{Binding Places}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding Path=id}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
编辑:
这是一个工作示例:
XAML:
<Grid>
<ListBox ItemsSource="{Binding Places}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=ID}" />
<TextBlock Text="{Binding Path=Title}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
Place.cs
public class Place
{
public string ID { get; set; }
public string Title { get; set; }
public string Latitude { get; set; }
public string Longitude { get; set; }
public string Web { get; set; }
}
MainViewModel.cs:
public class MainViewModel
{
public MainViewModel()
{
Places = new List<Place>();
}
public List<Place> Places { get; set; }
}
样本库(您应该拥有自己的):
public static List<Place> FetchData()
{
var lst = new List<Place>();
lst.Add(new Place { ID = "1", Title = "One", Latitude = "111", Longitude = "111", Web = "www......" });
lst.Add(new Place { ID = "2", Title = "Two", Latitude = "222", Longitude = "222", Web = "www......" });
lst.Add(new Place { ID = "3", Title = "Three", Latitude = "333", Longitude = "333", Web = "www......" });
lst.Add(new Place { ID = "4", Title = "Four", Latitude = "444", Longitude = "444", Web = "www......" });
return lst;
}
MainWindow.xaml.cs:
public MainWindow()
{
InitializeComponent();
//This is where the magic happens
//Fill the viewModel with the data
var viewModel = new MainViewModel { Places = Repository.FetchData() };
//Assign the viewModel with the data to the DataContext
//The bindings will be automatically done in the XAML
DataContext = viewModel;
}
这篇关于如何将数据绑定到Xaml,Windows Phone?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!