Проблема с отображением изображения

Question

Мой код работает не так, как я ожидал, привязка данных работает с другими полями и свойствами, но мое изображение не отображается. Ниже кода вы можете увидеть вывод приложения.

Вот код для XAML:

<StackLayout Padding="20">
    <Label Text="Id" TextColor="Red" />
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.id}"   IsReadOnly="True" />
    <Label Text="First Name" TextColor="Red"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.first_name}" IsReadOnly="True"/>
    <Label Text="Last Name" TextColor="Red"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.last_name}" IsReadOnly="True"/>
    <Label Text="Email" TextColor="Red"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.email}" IsReadOnly="True"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="Image" IsReadOnly="True"/>
    <Image BindingContext="{x:Reference Name=MyPage}" Source="{Binding obj.avatar}"/>
</StackLayout>

Answer 1

Ваш код выглядит хорошо, и вы можете напрямую связать строку с источником изображения, я написал демо для тестирования, и вы можете проверить код здесь:

В коде позади:

public partial class MainPage : ContentPage
{
    public MyModel obj { get; set; }
    public MainPage()
    {
        obj = new MyModel();
        obj.id = "idTest";
        obj.first_name = "alex";
        obj.last_name = "allen";
        obj.email = "abc.com";
        obj.avatar = "http://image10.bizrate-images.com/resize?sq=60&uid=2216744464";

        InitializeComponent();

    }
}

public class MyModel {

    public string id { get; set; }
    public string first_name { get; set; }
    public string last_name { get; set; }
    public string email { get; set; }
    public string avatar { get; set; }
}

И в 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"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="App150.MainPage"
             x:Name="MyPage"
             >

    <StackLayout Padding="20">
        <Label Text="Id" TextColor="Red" />
        <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.id}"   IsReadOnly="True" />
        <Label Text="First Name" TextColor="Red"/>
        <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.first_name}" IsReadOnly="True"/>
        <Label Text="Last Name" TextColor="Red"/>
        <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.last_name}" IsReadOnly="True"/>
        <Label Text="Email" TextColor="Red"/>
        <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.email}" IsReadOnly="True"/>
        <Editor BindingContext="{x:Reference Name=MyPage}" Text="Image" IsReadOnly="True"/>
        <Image BindingContext="{x:Reference Name=MyPage}" Source="{Binding obj.avatar}"/>
    </StackLayout>

</ContentPage>

Если URL вашего изображения начинается с http, вы должны добавить android:usesCleartextTraffic="true" к тегу приложения в файле манифеста.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" android:versionCode="1" android:versionName="1.0" package="com.companyname.app150">
    <uses-sdk android:minSdkVersion="21" android:targetSdkVersion="28" />
    <application android:label="App150.Android" android:usesCleartextTraffic="true"></application>

    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
</manifest>

И в iOS вы должны настроить параметры ATS .

Я загрузил свой пример проекта здесь , не стесняйтесь спрашивать меня, если у вас есть какие-либо вопросы.