Показать JSON ответ через связывание (формы Xamarin) - PullRequest
0 голосов
/ 26 февраля 2020

i want this below data to be showed in the above fields я показал json ответ, теперь я хочу, чтобы он отображался в правильном формате в разделе редактора. Ниже приведен мой код: (я пытаюсь сделать это за последние два дня, но я не знаю, как показать это в правильном формате)

Страница 1, откуда я передал данные json:

public partial class MainPage : ContentPage
{
    private static readonly HttpClient client = new HttpClient();
    public String test;

    public MainPage()
    {
        InitializeComponent();
        //     Task.Run(async () => await GetinfoAsync());
        GetinfoAsync();
    }

    public async Task GetinfoAsync()
    {
        var responseString = await client.GetStringAsync("https://reqres.in/api/users/2");

        UserResponse result = JsonConvert.DeserializeObject<UserResponse>(responseString);
        if (result != null)
        {
            Device.BeginInvokeOnMainThread(() =>
            {
                test = dis.Text = "Id:- " + result.Data.id + "\nEmail:- " + result.Data.email + "\nFirst Name:- " + result.Data.first_name + "\nLast Name:- " + result.Data.last_name + "\nImage:- " + result.Data.avatar; dis.Text = test;
            });
        }
    }

    private async void click_me(Object sender, EventArgs args)
    {
        await this.Navigation.PushAsync(new Data(test));
    }

Страница 2, где я получаю данные json со страницы 1

public partial class Data : ContentPage
{
    public MyUser obj;
    public String show;

    public Data(String test)
    {
        show = test;
        InitializeComponent();
        displaylabel.Text = test;
    }
}

Страница 2 Xaml

<StackLayout Padding="20">
    <Editor Text="{Binding obj.id}"   IsReadOnly="True"/>
    <Editor Text="{Binding obj.first_name}" IsReadOnly="True"/>
    <Editor Text="{Binding obj.last_name}" IsReadOnly="True"/>
    <Editor Text="{Binding obj.email}" IsReadOnly="True"/>
    <Editor Text="Image" IsReadOnly="True"/>
    <Image  HeightRequest="100" WidthRequest="100" Source="{Binding obj.avatar}"/>

    <Label Text="show json"
        x:Name="displaylabel"
    VerticalOptions="CenterAndExpand" 
    HorizontalOptions="CenterAndExpand" />

</StackLayout>

myuser.cs

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

public class UserResponse
{
    public MyUser Data { get; set; }
}

Ответы [ 3 ]

1 голос
/ 26 февраля 2020

Создайте новую страницу, отправьте json данные с вашей последней страницы и заполните здесь кодом Бело.

Код XAML

<Grid Margin="20,50">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Editor Grid.Row="0" Grid.Column="0" Text="id" IsReadOnly="True"/>
    <Editor x:Name="txtId" Grid.Row="0" Grid.Column="1" IsReadOnly="True"/>

    <Editor Grid.Row="1" Grid.Column="0" Text="First name" IsReadOnly="True"/>
    <Editor x:Name="txtFirstname" Grid.Row="1" Grid.Column="1"  IsReadOnly="True"/>

    <Editor Grid.Row="2" Grid.Column="0" Text="Last name" IsReadOnly="True"/>
    <Editor x:Name="txtLastname"  Grid.Row="2" Grid.Column="1"  IsReadOnly="True"/>

    <Editor Grid.Row="3" Grid.Column="0" Text="Email" IsReadOnly="True"/>
    <Editor x:Name="txtEmail" Grid.Row="3" Grid.Column="1"  IsReadOnly="True"/>

    <Editor Grid.Row="4" Grid.Column="0" Text="Image" IsReadOnly="True"/>
    <Image x:Name="imgUser" Grid.Row="4" Grid.Column="1" HeightRequest="100" WidthRequest="100" />

</Grid>

Код позади

public partial class Homepage : ContentPage
{
    private static readonly HttpClient client = new HttpClient();

    myuser _Data;
    public Homepage(myuser Data)
    {
        InitializeComponent();
        //this.BindingContext = new MainPageViewModel();
        _Data = Data;

    }

    protected override void OnAppearing()
    {
        base.OnAppearing();
        txtId.Text = _Data.id.ToString();
        txtFirstname.Text = _Data.first_name;
        txtLastname.Text = _Data.last_name;
        txtEmail.Text = _Data.email;
        imgUser.Source = _Data.avatar;
    }


}

Надеюсь, это поможет вам

Спасибо

0 голосов
/ 27 февраля 2020

Попытайтесь передать UserResponse непосредственно на страницу данных и связать его со страницей:

public partial class MainPage : ContentPage
{
  private static readonly HttpClient client = new HttpClient();
  public UserResponse test;

  public MainPage()
  {
    InitializeComponent();
    //     Task.Run(async () => await GetinfoAsync());
    GetinfoAsync();
  }

  public async Task GetinfoAsync()
  {
    var responseString = await client.GetStringAsync("https://reqres.in/api/users/2");

    UserResponse result = JsonConvert.DeserializeObject<UserResponse>(responseString);
    if (result != null)
    {
        Device.BeginInvokeOnMainThread(() =>
        {
            test = result;
        });
    }
  }

  private async void click_me(Object sender, EventArgs args)
  {
    await this.Navigation.PushAsync(new Data(test));
  }
}

Страница данных:

public partial class Data : ContentPage
{
  public UserResponse obj;
  public String show;

  public Data(UserResponse test)
  {
    obj= test;
    InitializeComponent();
    BindingContext = obj;
  }
}

xaml:

<StackLayout Padding="20">
  <Editor Text="{Binding Data.id}"   IsReadOnly="True"/>
  <Editor Text="{Binding Data.first_name}" IsReadOnly="True"/>
  <Editor Text="{Binding Data.last_name}" IsReadOnly="True"/>
  <Editor Text="{Binding Data.email}" IsReadOnly="True"/>
  <Editor Text="Image" IsReadOnly="True"/>
  <Image  HeightRequest="100" WidthRequest="100" Source="{Binding Data.avatar}"/>

  <Label Text="show json"
    x:Name="displaylabel"
    VerticalOptions="CenterAndExpand" 
    HorizontalOptions="CenterAndExpand" />

</StackLayout>
0 голосов
/ 26 февраля 2020

Во-первых, вы можете следовать шаблону MVVM, чтобы облегчить это в долгосрочной перспективе. Но если вы хотите продолжить работу с существующим кодом, попробуйте следующее:

Сначала настройте контекст привязки в вашем коде: xaml:

<ContentPage x:Name="MyPage" ... />

<StackLayout Padding="20">
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.id}"   IsReadOnly="True"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.first_name}" IsReadOnly="True"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.last_name}" IsReadOnly="True"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="{Binding obj.email}" IsReadOnly="True"/>
    <Editor BindingContext="{x:Reference Name=MyPage}" Text="Image" IsReadOnly="True"/>
    <Image x:Name="myImage" HeightRequest="100" WidthRequest="100"/>

    <Label Text="show json"
        x:Name="displaylabel"
    VerticalOptions="CenterAndExpand" 
    HorizontalOptions="CenterAndExpand" />

</StackLayout>

В вашем коде:

Вместо передачи string test вы можете объявить объект UserReponse:

private static readonly HttpClient client = new HttpClient();
public String test; //instead of this
public UserReponse result; //do this

Затем изменить это:

public async Task GetinfoAsync()
    {
        var responseString = await client.GetStringAsync("https://reqres.in/api/users/2");

        result = JsonConvert.DeserializeObject<UserResponse>(responseString); //modify to this

        if (result != null)
        {
            Device.BeginInvokeOnMainThread(() =>
            {
                test = dis.Text = "Id:- " + result.Data.id + "\nEmail:- " + result.Data.email + "\nFirst Name:- " + result.Data.first_name + "\nLast Name:- " + result.Data.last_name + "\nImage:- " + result.Data.avatar; dis.Text = test;
            });
        }
    }

Затем передать его:

 await this.Navigation.PushAsync(new Data(result));

Замените код вашей страницы 2 на:

public partial class Data : ContentPage
{

    private MyUser _obj;
    public MyUser obj
    {
       get{return _obj;}
       set
       {
          _obj = value;
          OnPropertyChanged();
       }
    }

    public String show;

    public Data(UserReponse result)
    {
        show = test;
        InitializeComponent();
        obj = result.Data;
        myImage.Source = ImageSource.FromUri(new Uri(obj.avatar));
        displaylabel.Text = test;
    }
}
...