我有一个获取并设置图像源的视图模型。我不知道这是否正确。
public class animalsmodel
{
public int id { get; set; }
public string AnimalNames { get; set; }
public Button Animalselect { get; set; }
public Button Back { get; set; }
public ImageSource AnimalPhoto { get; set; }
}
}
然后我在列表视图中使用它。但是感觉应该从资源中调用它吗?
private void SearchBar_TextChanged(object sender, TextChangedEventArgs e)
{
alistview.ItemsSource = GetAnimals(e.NewTextValue);
}
IEnumerable<animalsmodel> GetAnimals(string searchText = null)
{
var animals = new List<animalsmodel>
{
new animalsmodel() { id = 1, AnimalNames = "Aardvark", **AnimalPhoto** = ("AppSFari.Images.Aardvark.jpg")},
然后在我的XAML文件中使用它。显示名称,我可以看到图像应该在哪里,但是它是空白的。并且我已将项目中的图像设置为“嵌入式资源”。
<ListView x:Name="alistview" BackgroundColor ="AliceBlue" HasUnevenRows="True" ItemSelected="alistview_ItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<ImageCell ImageSource="{Binding AnimalPhoto}" Text="{Binding AnimalNames}"/>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
答案 0 :(得分:0)
感谢您的帮助。这就是我所做的,我将其用作列表视图的视图模型。
class ImageResourceExtention : IMarkupExtension
{
public string PhotoSource { get; set; }
public string AnimalNames { get; set; }
public Button Back { get; set; }
public Button Animalselect { get; set; }
public int id { get; set; }
public object ProvideValue(IServiceProvider serviceProvider)
{
if (PhotoSource == null)
{
return null;
}
var imageSource = ImageSource.FromResource(PhotoSource, typeof(ImageResourceExtention).GetTypeInfo().Assembly);
return imageSource;
}
}
然后,我的列表视图将具有ID,动物名和最后一张图像。这就是我的方法。我不知道图像部分是否正确?
public partial class AnimalsPage : ContentPage
{
private void SearchBar_TextChanged(object sender, TextChangedEventArgs e)
{
alistview.ItemsSource = GetAnimals(e.NewTextValue);
}
IEnumerable<ImageResourceExtention> GetAnimals(string searchText = null)
{
var animals = new List<ImageResourceExtention>
{
new ImageResourceExtention() { id = 1, AnimalNames = "Aardvark", PhotoSource = "AppSFari.Images.Aardvark.jpg"},
new ImageResourceExtention() { id = 2, AnimalNames = "Aardwolf", PhotoSource = "AppSFari.Images.Aardwolf.jpg" },
new ImageResourceExtention() { id = 3, AnimalNames = "Baboon" },
new ImageResourceExtention() { id = 4, AnimalNames = "Bat-eared Fox" },
new ImageResourceExtention() { id = 5, AnimalNames = "Black Backed Jackel" },
new ImageResourceExtention() { id = 6, AnimalNames = "Black Rhino" },
new ImageResourceExtention() { id = 7, AnimalNames = "Black Wildebeest" },
new ImageResourceExtention() { id = 8, AnimalNames = "Brown Hyena" },
new ImageResourceExtention() { id = 9, AnimalNames = "Buffalo" },
new ImageResourceExtention() { id = 10, AnimalNames = "Bush Pig" },
new ImageResourceExtention() { id = 11, AnimalNames = "Bushbuck" },
new ImageResourceExtention() { id = 12, AnimalNames = "Cape Grysbok" },
new ImageResourceExtention() { id = 13, AnimalNames = "Caracal" },
new ImageResourceExtention() { id = 14, AnimalNames = "Cheetah" },
new ImageResourceExtention() { id = 15, AnimalNames = "Common Duiker" },
new ImageResourceExtention() { id = 16, AnimalNames = "Eland" },
new ImageResourceExtention() { id = 17, AnimalNames = "Gemsbok/Oryx" },
new ImageResourceExtention() { id = 18, AnimalNames = "Giraffe" },
new ImageResourceExtention() { id = 19, AnimalNames = "Hippo" },
new ImageResourceExtention() { id = 20, AnimalNames = "Impala" },
};
if (String.IsNullOrWhiteSpace(searchText))
return animals;
var lowerAnimals = searchText.ToLower();
return animals.Where(c => c.AnimalNames.ToLower().StartsWith(lowerAnimals));
}
public AnimalsPage()
{
InitializeComponent();
alistview.ItemsSource = GetAnimals();
BindingContext = this;
}
async private void Button_Clicked(object sender, EventArgs e)
{
await myScrollview.ScrollToAsync(1, alistview.Y, true);
}
async private void alistview_ItemSelected(object sender, SelectedItemChangedEventArgs e)
{
var animals = e.SelectedItem as ImageResourceExtention;
await Navigation.PushAsync(new Aardvark(animals.AnimalNames, animals.Animalselect, animals.Back));
}
async private void Button_Clicked_1(object sender, EventArgs e)
{
await Navigation.PopAsync();
}
然后在我的内容页面中,列表和搜索栏都可以使用,但是图像应为空白。
x:Class="AppSFari.Kwandwe_Pakage.AnimalsPage"
xmlns:local="clr-namespace:AppSFari.Kwandwe_Pakage"
NavigationPage.HasNavigationBar="False">
<ContentPage.Content>
<ScrollView HeightRequest="3000" x:Name="myScrollview">
<AbsoluteLayout>
<StackLayout>
<SearchBar
TextChanged="SearchBar_TextChanged"
Placeholder="Search Animal"
PlaceholderColor="Gray"
HorizontalTextAlignment="Center"
FontSize="Small"
FontAttributes="Italic"
VerticalOptions="Center" HorizontalOptions="End"/>
<ListView x:Name="alistview" BackgroundColor ="AliceBlue"
HasUnevenRows="True"
ItemSelected="alistview_ItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal">
<Image Source="{Binding PhotoSource}" Aspect="AspectFit"
HeightRequest="60"
WidthRequest="60"/>
<Label Text="{Binding AnimalNames}" TextColor="Black"
FontFamily="appfontM"
VerticalTextAlignment="Center"/>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<Button Text="Back to top" Clicked="Button_Clicked"/>
</StackLayout>
<Button Text="Back" BackgroundColor="Transparent" FontSize="8"
AbsoluteLayout.LayoutBounds="0,0,0.2,0.05" AbsoluteLayout.LayoutFlags="All"
Clicked="Button_Clicked_1"/>
</AbsoluteLayout>
</ScrollView>
</ContentPage.Content>
</ContentPage>
对不起,如果我犯了愚蠢的错误,我是陌生的。
答案 1 :(得分:0)
您的代码完全不正确。
关于如何使用嵌入式图像,请检查here。
ProvideValue
方法仅在我们通过以下方式在xaml中设置 static 字符串时触发,
<Image Source="{local:ImageResource WorkingWithImages.beach.jpg}" />
换句话说,嵌入的图像只能在xaml中硬编码,而不能在代码中硬编码。
将图像放入特定的平台项目,iOS->图像资产/资源,Android->资源。
不要使用嵌入式图像,请使用本地图像,您可以参考
更改Aardvark构造函数的参数类型。
public Aardvark(String AnimalNames, Button Animalselect, Button Back, string PhotoSource)
{
InitializeComponent();
AnimalNameCall.Text = AnimalNames;
addanimal = Animalselect;
terug = Back;
dierfoto.Image = PhotoSource;
}
答案 2 :(得分:0)
好的,所以我尝试了该代码,但是仍然遇到相同的错误。这是我收到错误的行。 animals.PhotoSource
准确。
await Navigation.PushAsync(new Aardvark(animals.AnimalNames, animals.Animalselect, animals.Back, animals.PhotoSource));
在这里,我将为您提供所有代码:这就是我所更改的,就像您建议的AnimalPhoto
是每只动物的形象
async private void alistview_ItemSelected(object sender, SelectedItemChangedEventArgs e)
{
var animals = e.SelectedItem as ImageResourceExtention;
string AnimalPhoto = animals.PhotoSource;
await Navigation.PushAsync(new Aardvark(animals.AnimalNames, animals.Animalselect, animals.Back, animals.PhotoSource));
}
然后应进入动物名和按钮所在的Aardvark
页。我希望图像也被加载。这是xaml
x:Class="AppSFari.Kwandwe_Pakage.KwandweAnimal.Aardvark"
NavigationPage.HasNavigationBar="False">
<ContentPage.Content>
<AbsoluteLayout>
<Label x:Name="AnimalNameCall" FontSize="30" FontAttributes="Bold"
HorizontalTextAlignment="Center"
AbsoluteLayout.LayoutBounds="0,0.2,1,0.3" AbsoluteLayout.LayoutFlags="All"/>
<Image x:Name="dierfoto" AbsoluteLayout.LayoutBounds="0.5,0.5,0.5,0.5"
AbsoluteLayout.LayoutFlags="All"
Aspect="AspectFit"/>
<Button x:Name="addanimal" Text="+"
AbsoluteLayout.LayoutBounds="0.5,1,0.1,0.1"
AbsoluteLayout.LayoutFlags="All"
BackgroundColor="Transparent"
Clicked="addanimal_Clicked"/>
<Button x:Name="terug" Text="Back" FontSize="8"
BackgroundColor="Transparent"
AbsoluteLayout.LayoutBounds="0,0,0.2,0.1"
AbsoluteLayout.LayoutFlags="All"
Clicked="terug_Clicked"/>
</AbsoluteLayout>
</ContentPage.Content>
</ContentPage>
这是背后的代码。如果将Image PhotoSource
更改为字符串,则会在dierfoto = PhotoSource
public partial class Aardvark : ContentPage
{
public Aardvark(String AnimalNames, Button Animalselect, Button Back, Image PhotoSource)
{
InitializeComponent();
AnimalNameCall.Text = AnimalNames;
addanimal = Animalselect;
terug = Back;
dierfoto = PhotoSource;
}
async private void terug_Clicked(object sender, EventArgs e)
{
await Navigation.PopAsync();
}
private void addanimal_Clicked(object sender, EventArgs e)
{
string AnimalNames = AnimalNameCall.Text;
MessagingCenter.Send<Aardvark, string>(this, "Add", AnimalNames);
}
}
}