How to de-serialize json in c#? - windows-phone-8

I am trying to deserialize json, I'm getting an error:
"An exception of type 'Newtonsoft.Json.JsonSerializationException' occurred in Newtonsoft.Json.DLL but was not handled in user code"
My code:
public void w_StandingsDownloadStringCompleted(object sender, DownloadStringCompletedEventArgs e)
{
if (!string.IsNullOrEmpty(e.Result))
{
JsonSerializer jc = new JsonSerializer();
// var o = jc.Deserialize<RootObjectStandings>(e.Result);
var root3 = JsonConvert.DeserializeObject<RootObjectStandings>(e.Result);
// var root2 = JsonConvert.DeserializeObject<Headline>(e.Result);
football f = new football();
f.StandingList.ItemsSource = root3.info;
f.progressbar1.IsEnabled = false;
f.progressbar1.IsIndeterminate = false;
f.progressbar1.Visibility = Visibility.Collapsed;
}
}
Class:
public class RootObjectStandings
{
public int position { get; set; }
public int team_id { get; set; }
public string team { get; set; }
public string teamshort { get; set; }
public string teampath { get; set; }
public int played { get; set; }
public int won { get; set; }
public int drawn { get; set; }
public int lost { get; set; }
public int #for { get; set; }
public int against { get; set; }
public int difference { get; set; }
public Home home { get; set; }
public Away away { get; set; }
public int points { get; set; }
public string info { get; set; }
}
and xaml code:
<ListBox x:Name="StandingList" FontFamily="Arial Black" VerticalAlignment="Center" Margin="-6,0,0,-26" Height="610" RenderTransformOrigin="0.5,0.5" Background="{x:Null}" Opacity="0.8">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Button Style="{StaticResource ButtonStyle1}" Width="450" Height="Auto" Background="Black" BorderBrush="Transparent" FontWeight="Bold" FontSize="23" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,0,0,5" Opacity="0.95" Foreground="White">
<StackPanel>
<TextBlock TextWrapping="Wrap" FontFamily="Segoe WP Black" Foreground="White" FontSize="18" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" TextAlignment="Left" Width="350" Height="150">
<Run FontSize="23" Text="{Binding info}" />
<LineBreak/>
<Run Text="{Binding position}" FontWeight="Normal" FontSize="16" FontFamily="Segoe WP SemiLight"/>
</TextBlock>
</StackPanel>
</Button>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
What is going wrong? help

Related

Xamarin - Fill ListView with MySql Data

I'm kind of stuck and not getting anywhere. Here is my problem:
I want to populate a ListView with the data from a MySql database. Here is my class which contains the database queries:
DBConnection:
public ObservableRangeCollection<ExpenseReport> GetDataExpenseReport()
{
if (OpenConnection() == true)
{
DataExpense = new ObservableRangeCollection<ExpenseReport>();
MySqlCommand sc = new MySqlCommand();
sc.CommandText = "SELECT * FROM t_expensereport WHERE c_inputuser = #userid";
sc.Parameters.AddWithValue("#userid", User.Id);
sc.Connection = myConn;
MySqlDataReader dr = sc.ExecuteReader();
while (dr.Read())
{
DataExpense.Add(new ExpenseReport
{
Date = (DateTime)dr["c_date"],
Reason = (string)dr["c_reason"],
TripThereAndBack = (string)dr["c_tripThereAndBack"],
Vehicle = (string)dr["c_vehicle"],
Kilometers = (double)dr["c_kilometers"],
EuroProKm = (double)dr["c_euroProKm"],
TripCost = (double)dr["c_tripCost"],
Maut = (double)dr["c_maut"],
ParkingLot = (double)dr["c_parkingLot"],
Other = (double)dr["c_other"],
Accommodation = (double)dr["c_accommodation"],
Meal = (double)dr["c_meal"],
TrainTicket = (double)dr["c_trainTicket"]
});
}
dr.Close();
return DataExpense;
}
return null;
}
My Model ExpenseReport:
public class ExpenseReport
{
public DateTime Date { get; set; }
public string Reason { get; set; }
public string TripThereAndBack { get; set; }
public string Vehicle { get; set; }
public double Kilometers { get; set; }
public double EuroProKm { get; set; }
public double TripCost { get; set; }
public double Maut { get; set; }
public double ParkingLot { get; set; }
public double Other { get; set; }
public double Accommodation { get; set; }
public double Meal { get; set; }
public double TrainTicket { get; set; }
}
View:
<?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:viewmodels="clr-namespace:Magazin.ViewModels.Dashboard"
xmlns:xct="http://xamarin.com/schemas/2020/toolkit"
xmlns:model="clr-namespace:Magazin.Models"
x:Class="Magazin.Views.Dashboard.OverviewExpenseReportView"
Title="Übersicht Spesen">
<ContentPage.BindingContext>
<viewmodels:OverviewExpenseReportViewModel/>
</ContentPage.BindingContext>
<ContentPage.Behaviors>
<xct:EventToCommandBehavior
EventName="Appearing"
Command="{Binding RefreshCommand}" />
</ContentPage.Behaviors>
<ContentPage.Content>
<StackLayout>
<ListView
x:Name="OverviewER"
CachingStrategy="RecycleElement"
BackgroundColor="Transparent"
ItemsSource="{Binding ExpenseReport}"
HasUnevenRows="True"
SeparatorVisibility="None"
IsPullToRefreshEnabled="True"
IsRefreshing="{Binding IsBusy, Mode=OneWay}"
RefreshControlColor="Green"
RefreshCommand="{Binding RefreshCommand}">
<!---->
<ListView.ItemTemplate>
<DataTemplate x:DataType="model:ExpenseReport">
<ViewCell>
<Grid Padding="10">
<Frame CornerRadius="20" HasShadow="True">
<StackLayout Orientation="Horizontal">
<StackLayout Padding="20,0,0,0">
<StackLayout>
<Label Text="{Binding Reason}" FontSize="Medium" VerticalOptions="Center" TextColor="Green" />
</StackLayout>
<StackLayout>
<Label Text="{Binding Kilometers, StringFormat='{}{0}km'}" FontSize="Small" VerticalOptions="Center"/>
<Label Text="{Binding Date, StringFormat='{0:dd.MM.yyyy}'}" FontSize="Small" VerticalOptions="Center"/>
<Label Text="{Binding TripCost}" FontSize="Small" VerticalOptions="Center"/>
</StackLayout>
</StackLayout>
</StackLayout>
</Frame>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
</ContentPage>
Viewmodel OverviewExpenseReportViewModel
public class OverviewExpenseReportViewModel : ViewModelBase
{
public ObservableRangeCollection<ExpenseReport> ExpenseReportCollection { get; set; }
public AsyncCommand RefreshCommand { get; }
public OverviewExpenseReportViewModel()
{
RefreshCommand = new AsyncCommand(Refresh);
}
async Task Refresh()
{
ExpenseReportCollection = new ObservableRangeCollection<ExpenseReport>();
DBConnection db = new DBConnection();
await Task.Delay(1500);
ExpenseReportCollection.Clear();
ExpenseReportCollection.AddRange(db.GetDataExpenseReport());
}
}
I have long asked our friend Google but I somehow do not get anywhere. At this point
ExpenseReport.AddRange(db.GetDataExpenseReport()); I get the error that System.NullReferenceException: 'Object reference not set to an instance of an object.'
Can anyone help me on how I manage to populate the ListView, I appreciate any answers!
Lastly, I switched everything to ObservableRangeCollection from the MvvmHelpers dependency. But I always get this error, something I am doing wrong.
you are declaring ExpenseReport
public ObservableRangeCollection<ExpenseReport> ExpenseReport { get; set; }
but it will be null until you instantiate it
ExpenseReport = new ObservableRangeCollection<ExpenseReport>();
System.InvalidCastException: 'Specified cast is not valid.. Is
something wrong with that Line?
ExpenseReport.AddRange(db.GetDataExpenseReport());``
For this problem, you need to recheck the data type of the returned list and the object included in the returned list.
Suppose the returned type is IList<object>, then you cast IList<object> to List<ExpenseReport>,just as follows:
//initialize variable `ExpenseReport` here
ExpenseReportCollection = new ObservableRangeCollection<ExpenseReport>();
//suppose `data` is the returned data list
ExpenseReportCollection.AddRange(data as List<ExpenseReport>);
Suppose the type of returned Object(OtherObject) is not the same object(ExpenseReport), you need to iterate through the returned list one by one and then convert the returned Object to object ExpenseReport.

Display Data from API on screen in a decent form

i showed API data on screen but in JSON format. Now i want it to look a little bit decent. What changes can i made and in which section.
Here is the API data:
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; }
}
}
design Page xaml:
<StackLayout Padding="20">
<Editor Text="id" IsReadOnly="True"/>
<Editor Text="First name" IsReadOnly="True"/>
<Editor Text="Last name" IsReadOnly="True"/>
<Editor Text="Email" IsReadOnly="True"/>
<Image Source="https://s3.amazonaws.com/uifaces/faces/twitter/josephstein/128.jpg">
</Image>
<Label Text="show json"
x:Name="displaylabel"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</StackLayout>
xaml.cs Here i called the API and showed it in JSON format
private static readonly HttpClient client = new HttpClient();
// private String data;
public String show;
//String responseString;
public Data(String data)
{
InitializeComponent();
Task.Run(async () => await GetinfoAsync());
var ID = new Editor { Text = "Id", IsReadOnly = true };
var FirstName = new Editor { Text = "first name", IsReadOnly = true };
var LastName = new Editor { Text = "lastname", IsReadOnly = true };
var Email = new Editor { Text = "email", IsReadOnly = true };
var Avatar = ImageSource.FromUri(new Uri("https://s3.amazonaws.com/uifaces/faces/twitter/josephstein/128.jpg"));
}
public async Task GetinfoAsync()
{
var responseString = await
client.GetStringAsync("https://reqres.in/api/users/2");
show = responseString;
// DisplayAlert("text", responseString, "ok");
Device.BeginInvokeOnMainThread(() => {
displaylabel.Text = show;
});
}
#Sajawal Zubairi
Please try this code it will help you to find your solution:
First, need to install the Newtonsoft.Json package in your project.
XAML Code:-
<StackLayout Padding="20">
<Editor Text="id" IsReadOnly="True"/>
<Editor Text="First name" IsReadOnly="True"/>
<Editor Text="Last name" IsReadOnly="True"/>
<Editor Text="Email" IsReadOnly="True"/>
<Image Source="https://s3.amazonaws.com/uifaces/faces/twitter/josephstein/128.jpg">
</Image>
<Label Text="show json"
x:Name="displaylabel"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</StackLayout>
C# Code:-
public partial class MainPage : ContentPage
{
private static readonly HttpClient client = new HttpClient();
public MainPage()
{
InitializeComponent();
GetinfoAsync();
}
public async Task GetinfoAsync()
{
var responseString = await client.GetStringAsync("https://reqres.in/api/users/2");
myuserResponse result = JsonConvert.DeserializeObject<myuserResponse>(responseString);
// DisplayAlert("text", responseString, "ok");
if (result != null)
{
Device.BeginInvokeOnMainThread(() =>
{
displaylabel.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;
});
}
}
}
API Data Model :-
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 myuserResponse
{
public myuser Data { get; set; }
}
OUTPUT Look like Below Image:
I hope the above code will be useful for you.
Thank You
You can achive your requirement using MVVM approach below is my code will help you
ViewModel code
public class MainPageViewModel : INotifyPropertyChanged
{
private static readonly HttpClient client = new HttpClient();
private UserDTO user;
public UserDTO UserData
{
get { return user; }
set
{
user = value;
OnPropertyChanged();
}
}
public MainPageViewModel()
{
GetUserData();
}
public async Task GetUserData()
{
var responseString = await client.GetStringAsync("https://reqres.in/api/users/2");
UserDTOResponse result = JsonConvert.DeserializeObject<UserDTOResponse>(responseString);
// DisplayAlert("text", responseString, "ok");
if (result != null)
{
UserData = result.Data;
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChangedEventHandler handler = PropertyChanged;
if (handler != null)
handler(this, new PropertyChangedEventArgs(propertyName));
}
}
View(XAML code)
<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 Grid.Row="0" Grid.Column="1" Text="{Binding UserData.id}" IsReadOnly="True"/>
<Editor Grid.Row="1" Grid.Column="0" Text="First name" IsReadOnly="True"/>
<Editor Grid.Row="1" Grid.Column="1" Text="{Binding UserData.first_name}" IsReadOnly="True"/>
<Editor Grid.Row="2" Grid.Column="0" Text="Last name" IsReadOnly="True"/>
<Editor Grid.Row="2" Grid.Column="1" Text="{Binding UserData.last_name}" IsReadOnly="True"/>
<Editor Grid.Row="3" Grid.Column="0" Text="Email" IsReadOnly="True"/>
<Editor Grid.Row="3" Grid.Column="1" Text="{Binding UserData.email}" IsReadOnly="True"/>
<Editor Grid.Row="4" Grid.Column="0" Text="Image" IsReadOnly="True"/>
<Image Grid.Row="4" Grid.Column="1" HeightRequest="100" WidthRequest="100" Source="{Binding UserData.avatar}"/>
</Grid>
Models
public class UserDTO
{
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 UserDTOResponse
{
public UserDTO Data { get; set; }
}
Output
enter image description here
I hope it will help you.
Thank you

I am using caliburn micro, but cannot Action in the SelectedItemChanged

My pivotPageViewModel
public class PivotPageViewModel : Conductor<IScreen>.Collection.OneActive
{
private readonly PivotItem1PageViewModel item1;
private readonly PivotItem2PageViewModel item2;
public PivotPageViewModel(PivotItem1PageViewModel item1, PivotItem2PageViewModel item2)
{
this.item1 = item1;
this.item2 = item2;
}
protected override void OnInitialize()
{
base.OnInitialize();
Items.Add(item1);
Items.Add(item2);
ActivateItem(item1);
}
}
PivotItem1
public class PivotItem1PageViewModel : Screen
{
public String DisplayName { get; set; }
public List<String> Item{ get; set; }
public PivotItem1PageViewModel (INavigationService navigationService)
: base(navigationService)
{
DisplayName = "Name";
Item= new List<String>();
Item.Add("one");
Item.Add("two");
Item.Add("three");
Item.Add("four");
}
public void SelectedItemChanged(String select)
{
Debug.WriteLine("HElllo!!! " + select);
}
}
XAML
<ListBox x:Name="Secretariat" Foreground="Black"
FontFamily="{StaticResource PhoneFontFamilyLight}"
FontSize="50" Margin="10,0,-14,0"
cal:Message.Attach="[Event SelectionChanged] = [Action SelectedItemChanged($this)]">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>`
My SelectedItemChanged not work when i use pivotitem, but when i use a page normal the SelectedItemChanged usually work
According Caliburn.Micro documentation :
$this - The actual ui element to which the action is attached
So most likely your select parameter is not a String but ListBox. Do you have any exception from Caliburn about 'action not found'?

how to optimize windows phone nested list box?

here is my data source type
public class Part
{
public int PartNumber { get; set; }
public string ar_PartNumber { get; set; }
public List<PartSuras> PartSuras { get; set; }
public int PageNumber { get; set; }
public string ar_PageNumber { get; set; }
}
public class PartSuras
{
public int SuraID { get; set; }
public string ar_SuraID { get; set; }
public string SuraTitle { get; set; }
public string SuraTitleEn { get; set; }
public int StartVerseID { get; set; }
public int PageNumber { get; set; }
public string ar_PageNumber { get; set; }
}
and here is the nested listboxs
<ListBox Loaded="list_Index_Loaded" Name="list_Index" HorizontalAlignment="Stretch" Margin="-12,-40,-12,0" VerticalAlignment="Top" ScrollViewer.VerticalScrollBarVisibility="Disabled">
<ListBox.ItemTemplate >
<DataTemplate>
<StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Top">
<Button HorizontalAlignment="Stretch" Width="480" BorderBrush="#FFCADBBD" Margin="0,-12" BorderThickness="0,0,0,2" Background="#FFD2BC70" Foreground="Black" Name="bt_part" Tag="{Binding PageNumber}" Tap="bt_part_Tap" >
<TextBlock HorizontalAlignment="Stretch" TextAlignment="Center">
<Run Text="الجزء "></Run>
<Run Text="{Binding ar_PartNumber}"></Run>
</TextBlock>
</Button>
<ListBox Name="list_sura" ItemsSource="{Binding PartSuras}" ScrollViewer.VerticalScrollBarVisibility="Disabled">
<ListBox.ItemTemplate>
<DataTemplate>
<Button HorizontalAlignment="Stretch" Width="480" Margin="0,-12" BorderThickness="0,0,0,2" Background="#FFE5DCAA" Foreground="Black" Name="bt_part" Tag="{Binding PageNumber}" Tap="bt_part_Tap" >
<Grid Width="430" HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
<ColumnDefinition></ColumnDefinition>
<ColumnDefinition></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" HorizontalAlignment="Stretch" TextAlignment="Left">
<Run Text="{Binding ar_SuraID}"></Run>
<Run Text="-"></Run>
<Run Text="{Binding SuraTitle}"></Run>
</TextBlock>
<TextBlock Grid.Column="1" HorizontalAlignment="Stretch" TextAlignment="Right" Text="{Binding ar_PageNumber}"></TextBlock>
</Grid>
</Button>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
this is kind of slow it takes almost 3 secs to only build the listboxes -i meseured the time of build the data source and it's okay- in Lumia 920 (1 GB ram) device, how can i optimize that?
would the performance be better if i removed the listboxes and created the controls in code behind?
If you do not need scrolling (you have ScrollViewer.VerticalScrollBarVisibility="Disabled"), try using ItemsControl instead, it should perform better.
Use LongListSelector for your outer Listbox and ItemsControl for your inner Listbox. Because LongListSelector is more optimized than ListBox, where as you cannot use a nested longlistselector which leads to scrolling and virtualization problem

Bind ImageSource in Windows Phone

I am Using LazyListBox as given below.There is an Image in Data Template.And I am not able to Bind the ImageUrl.How can i Bind ImageSource.
<lazy:LazyListBox x:Name="d" ItemSource={Binding ProductImageLIst}>
<lazy:LazyListBox.LoadedItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Product_Id}" Foreground="Black"></TextBlock>
<Image x:Name="img" Source="{Binding Path=ImageUrl}"></Image>
</StackPanel>
</DataTemplate>
</lazy:LazyListBox.LoadedItemTemplate>
</lazy:LazyListBox>
And my ProductImageList Class is Shown Below
public class ProductImageList
{
public string ImageId { get; set; }
public string ImageUrl{ get; set; }
public string Product_Id { get; set; }
public string Category_id { get; set; }
public ProductImageList()
{
}
public ProductImageList(string imageid, string imageurl, string productid,string catid)
{
this.ImageId = imageid;
this.ImageUrl = imageurl;
this.Product_Id = productid;
this.Category_id = catid;
}
}
Use BitmapImage to bind source of image in LazyListBox control. Here is the solution. If your 'ImageUrl' is a http url you should first download image from this url and create BitmapImage by downloaded image stream, and if your imageUrl is a relative url create BitmapImage as below.
<lazy:LazyListBox x:Name="d" ItemSource={Binding ProductImageLIst}>
<lazy:LazyListBox.LoadedItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Product_Id}" Foreground="Black"></TextBlock>
<Image x:Name="img" Source="{Binding Path=ImageSource}"></Image>
</StackPanel>
</DataTemplate>
</lazy:LazyListBox.LoadedItemTemplate>
</lazy:LazyListBox>
public class ProductImageList
{
public string ImageId { get; set; }
public string ImageUrl{ get; set; }
public string Product_Id { get; set; }
public string Category_id { get; set; }
public BitmapImage ImageSource{get;set;}
public ProductImageList()
{
}
public ProductImageList(string imageid, string imageurl, string productid,string catid)
{
this.ImageId = imageid;
this.ImageUrl = imageurl;
this.Product_Id = productid;
this.Category_id = catid;
this.ImageSource = new BitmapImage(new Uri(imageurl, UriKind.RelativeOrAbsolute));
}
}