我正在开发一个食物食谱应用程序,这是我第一次使用Xamarin. Forms。目前,我的实时数据库看起来像这样:
- 食谱分类
- 低卡路里
- 食谱1
- 名称
- 描述
- imageURL
- 卡路里
- 配料
- 食谱2
- 名称
- 描述
- imageURL
- 卡路里
- 配料
- 食谱3
- 名称
- 描述
- imageURL
- 卡路里
- 配料
我填写了他们manuallt,我想要的是检索数据(名称,描述,imageURL,卡路里,成分)为每个食谱将显示在一个屏幕(RecipesScreen.xaml),其中将包含食谱的这些细节。我编码这个屏幕,以获取数据,但没有显示!只有标签显示。我一直在尝试如何获得这些数据,但似乎我无法检索数据。
FirebaseHelper.cs代码如下:
namespace dishgoFinalApp
{
internal class FirebaseHelper
{
FirebaseClient firebase = new FirebaseClient("https://foodapp-7052b-default-rtdb.asia-southeast1.firebasedatabase.app/");
public async Task<List<Recipe>> GetAllRecipesAsync(string category)
{
var recipes = await firebase
.Child("RecipeCategories")
.Child(category)
.OnceAsync<Recipe>();
return recipes.Select(r => new Recipe
{
Name = r.Object.Name,
Description = r.Object.Description,
ImageUrl = r.Object.ImageUrl,
Calories = r.Object.Calories,
Ingredients = r.Object.Ingredients
}).ToList();
}
public class Recipe
{
public string Name { get; set; }
public string Description { get; set; }
public string ImageUrl { get; set; }
public int Calories { get; set; }
public List<string> Ingredients { get; set; }
}
}
}
下面是RecipesScreen.xaml.cs的代码:
namespace dishgoFinalApp
{
[XamlCompilation(XamlCompilationOptions.Compile)]
public partial class RecipesScreen : ContentPage
{
private FirebaseHelper firebaseHelper;
private List<Recipe> recipes;
public RecipesScreen()
{
InitializeComponent();
firebaseHelper = new FirebaseHelper();
recipes = new List<Recipe>();
}
public RecipesScreen(string category) : this()
{
LoadRecipes(category);
}
private async void LoadRecipes(string category)
{
recipes = await firebaseHelper.GetAllRecipesAsync(category);
// Bind the list of recipes to a ListView or other UI element here
}
}
}
下面是RecipesScreen.xaml的代码:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="dishgoFinalApp.RecipesScreen">
<ContentPage.Content>
<StackLayout>
<Label Text="Welcome to Xamarin.Forms!"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
<ListView ItemsSource="{Binding Recipes}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal" Padding="10">
<Image Source="{Binding ImageUrl}" WidthRequest="80" HeightRequest="80" />
<StackLayout Padding="10">
<Label Text="{Binding Name}" FontAttributes="Bold" />
<Label Text="{Binding Description}" />
<Label Text="{Binding Calories, StringFormat='Calories: {0:F0}'}" />
<Label Text="Ingredients:" FontAttributes="Bold" />
<Label Text="{Binding IngredientsAsString}" />
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
</ContentPage>
我希望数据名称、描述、imageURL、卡路里、成分显示在RecipesScreen.xaml屏幕中。
1条答案
按热度按时间qqrboqgw1#
你的代码有几个问题。
一个问题,你定义了变量
recipes
,但是你绑定了Recipes
到属性ItemsSource for your
ListView`因此,您可以尝试替换以下代码:
其中:
并按如下方式绑定:
另外,还需要为页面设置
BindContext
,可以在页面RecipesScreen.xaml.cs
的构造函数上设置BindContext
请参考以下代码:
注意事项:
建议您定义变量
Recipes
的类型如下:并初始化它:
从文档ObservableCollection Class中,我们知道当列表中添加或删除项目时,UI将自动刷新。