We Keep Coding

Dictionary (ObservableCollection) binding to ListView in Windows Phone 8.1

I am trying to bind a dictionary to two textblocks in a listview. The listview ItemsSource binding is defined in the code behind and the text blocks content is in the XAML.
I am able to display the items but they are displayed with square brackets around each row like [stringA, stringB]. However, this format will not work. The latest code that I tried was by setting the Key and Value which did not work was:
XAML:
<ListView Name="lvListLogs"
Margin="0,10,0,0">
<ListView.ItemTemplate>
<DataTemplate x:Name="ListItemTemplate">
<Grid Margin="5,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="122"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition MaxHeight="104"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock x:Name="tb_PointName" Grid.Column="1"
Text="{Binding Key}"
Margin="10,0,0,0" FontSize="40"
TextWrapping="Wrap"
MaxHeight="72"
Foreground="#FFFE5815" />
<TextBlock x:Name="tb_PointValue" Grid.Column="1"
Text="{Binding Value}"
Margin="10,0,0,0" FontSize="40"
TextWrapping="Wrap"
MaxHeight="72"
Foreground="#FFFE5815" />
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
C# (abridged for clarity):
public Dictionary<string, string> mydict2 { get; set; }
mydict2 = new Dictionary<string, string>();
if (item != null)
{
var props = item.GetType().GetRuntimeProperties();
foreach (var prop in props)
{
foreach (var itm in group1.Items.Where(x => x.UniqueId == prop.Name))
{
var _Title = prop.Name;
var _Value = prop.GetValue(item, null);
string propertyValue;
string propertyName;
propertyValue = Convert.ToString(_Value);
propertyName = _Title;
mydict2.Add(_Title, propertyValue);
}
}
//binding here
lvListLogs.ItemsSource = mydict2;
}
Any assistance would be appreciated.

Your code works fine, the problem is you set the same Grid.Column for both TextBlocks. The first column index should be zero:
<TextBlock x:Name="tb_PointName" Grid.Column="0" ...

To achieve the required binding, instead of the Dictionary I used an ObservableCollection with the class and constructor.
To databind the listview (xaml) to ObservableCollection:
Create the Class with Constructor
public class PointInfoClass
{
public string PointName { get; set; }
public string PointValue { get; set; }
public PointInfoClass(string pointname, string pointvalue)
{
PointName = pointname;
PointValue = pointvalue;
}
}
Create collection of the PointInfoClass
public ObservableCollection<PointInfoClass> PointInfo
{
get
{
return returnPointInfo;
}
}
Instantiate the collection
ObservableCollection<PointInfoClass> returnPointInfo = new ObservableCollection<PointInfoClass>();
Add item to collection
returnPointInfo.Add(new PointInfoClass(string1, string2));
Databind to the ObservableCollection name.
The xaml code:
<ListView
Grid.Row="1"
ItemsSource="{Binding PointInfo}"
IsItemClickEnabled="True"
ItemClick="ItemView_ItemClick"
Margin="19,0.5,22,-0.333"
x:Name="lvPointInfo"
Background="White">
<ListView.ItemTemplate>
<DataTemplate >
<Grid Margin="0,0,0,20">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="270"/>
<ColumnDefinition Width="60"/>
</Grid.ColumnDefinitions>
<StackPanel Orientation="Vertical" Grid.Column="1" VerticalAlignment="Top">
<TextBlock x:Name="tb_PointSubTitle" Grid.Column="1"
Text="{Binding PointName}"
Margin="10,0,0,0" FontSize="20"
TextWrapping="Wrap"
MaxHeight="72"
Foreground="#FF5B5B5B"
/>
</StackPanel>
<StackPanel Orientation="Vertical" Grid.Column="2" VerticalAlignment="Top" HorizontalAlignment="Right">
<TextBlock x:Name="tb_PointValue"
Grid.Column="1"
Text="{Binding PointValue}"
Margin="0,5,0,0" FontSize="20"
HorizontalAlignment="Right"
TextWrapping="Wrap"
FontWeight="Normal"
Foreground="Black" />
</StackPanel>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Set the DataContext of the ListView
lvPointInfo.DataContext = this;
This code is edited for clarity.

Data binding into textblock from sqlite database on windows store app

I'm trying to bind my data from sqlite.net database into textblock. I've searched a lot about it, but I still have a few problems:
1) anoying exception occurs where in the Additional Information is: "Constraint" and nothing else. The problem is also that it doesn't appear every time I run the app.
2) I cannot see my Binding data into the textblock.
I've composed me code according to this example: Windows Store App writing sqlite query into the listview's textblocks
I've tried also this select data from sqlite database and binding values to listbox item in windows phone 8 apps
but none of this solving my problem.
Here is my XAML code:
<Grid>
<Grid.Background>
<ImageBrush ImageSource="/Assets/rankingTlo.png"/>
</Grid.Background>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="5*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="1*"/>
<RowDefinition Height="4*"/>
</Grid.RowDefinitions>
<TextBlock Grid.Column="1" HorizontalAlignment="Center" Text="Pytanie" VerticalAlignment="Top" FontFamily="Arial" FontSize="20" Margin="-83,71,0,0" Foreground="#FF353535" FontWeight="Bold"/>
<TextBlock Grid.Column="1" HorizontalAlignment="Center" Text="2" VerticalAlignment="Top" Foreground="#FFB41019" Margin="17,59,0,0" FontFamily="Arial" FontWeight="Bold" FontSize="33" />
<TextBlock Grid.Column="1" HorizontalAlignment="Center" Text="z" VerticalAlignment="Top" Foreground="#FF353535" Margin="56,71,0,0" FontFamily="Arial" FontWeight="Bold" FontSize="20" />
<TextBlock Grid.Column="1" HorizontalAlignment="Center" Text="14" VerticalAlignment="Top" Foreground="#FF353535" Margin="109,59,0,0" FontFamily="Arial" FontWeight="Bold" FontSize="33" />
<TextBlock Grid.Column="1" HorizontalAlignment="Center" Text="poziom" VerticalAlignment="Top" FontFamily="Arial" FontSize="16" Margin="-88,96,0,0" Foreground="#FF353535" FontWeight="Bold"/>
<TextBlock Grid.Column="1" HorizontalAlignment="Center" Text="licealista" VerticalAlignment="Top" FontFamily="Arial" FontSize="16" Margin="47,96,0,0" Foreground="#FFB41019" FontWeight="Bold"/>
<ListView Name="listView1" Grid.Column="1" Grid.Row="1" >
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Width="Auto" Height="50" HorizontalAlignment="Left" TextWrapping="Wrap" Text="{Binding tresc_pytania}" VerticalAlignment="Top" Foreground="Black" FontFamily="Arial" FontSize="24"/>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
class pytania
{
[PrimaryKey]
public int id_pytania { get; set; }
public string tresc_pytania { get; set; }
public int poziom_trudnosci { get; set; }
public string odpowiedz1 { get; set; }
public string odpowiedz2 { get; set; }
public string odpowiedz3 { get; set; }
public string odpowiedz4 { get; set; }
public int dobra_odpowiedz { get; set; }
}
private void Page_Loaded(object sender, RoutedEventArgs e)
{
string dbPath = Path.Combine(Windows.Storage.ApplicationData.Current.LocalFolder.Path, "baza.ext");
using (var dbConn = new SQLite.SQLiteConnection(dbPath))
{
var query = dbConn.Table<pytania>();
listView1.ItemsSource = query.ToList();
}
}
Hope to hear from you some piece of advice.
Best regards,
Tomas

Windows Phone Longlistselector ItemsSource Performance

I'm working on an app for Windows Phone (Silverlight WP 8.0) with a custom UserControl containing three LongListSelectors. This UserControl sits inside of a Panorama. When an item is selected from the first list, the user control changes visual states and animates the second list in, and the same for the third. The problem I'm encountering is the long load time between changing the ItemsSource of the list (either explicitly or through binding) and the actual rendering of the items. With a list of about 20 items, the time is at least 500ms, sometimes over 1 second. This seems unreasonable. Here's the XAML I'm working with:
MainPage.xaml:
<phone:Panorama Template="{StaticResource TunrPanorama}">
<!--Panorama item one-->
<phone:PanoramaItem Background="White" Style="{StaticResource MusicPanoramaItemStyle}">
<tunr:LibraryControl DataContext="{Binding}" TrackSelected="LibraryControl_TrackSelected" />
</phone:PanoramaItem>
LibraryControl.xaml:
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel x:Name="stackPanel" Grid.Row="0" Orientation="Vertical" Height="108">
<!-- Some headers here -->
</StackPanel>
<Grid Grid.Row="1" Margin="12,0,0,0">
<!-- List number 1 -->
<phone:LongListSelector Grid.Row="0" Grid.Column="0" x:Name="music_artists" VerticalAlignment="Stretch" ItemsSource="{Binding ArtistList}" SelectionChanged="music_artists_SelectionChanged" RenderTransformOrigin="0.5,0.5">
<phone:LongListSelector.RenderTransform>
<CompositeTransform/>
</phone:LongListSelector.RenderTransform>
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<ListBoxItem Margin="0,6,0,6">
<StackPanel>
<TextBlock Text="{Binding}" TextWrapping="NoWrap" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeLarge}" Foreground="Black"/>
</StackPanel>
</ListBoxItem>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
<!-- List number 2 -->
<phone:LongListSelector Grid.Row="0" Grid.Column="0" x:Name="music_albums" LayoutMode="Grid" GridCellSize="190,190" SelectionChanged="music_albums_SelectionChanged" RenderTransformOrigin="0.5,0.5">
<phone:LongListSelector.RenderTransform>
<CompositeTransform/>
</phone:LongListSelector.RenderTransform>
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<ListBoxItem Margin="6,6,6,6">
<Grid>
<Border Width="178" Height="178" Background="#FF838383" />
</Grid>
</ListBoxItem>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
<!-- List number 3 -->
<phone:LongListSelector Grid.Row="0" Grid.Column="0" x:Name="music_tracks" SelectionChanged="music_tracks_SelectionChanged">
<phone:LongListSelector.RenderTransform>
<CompositeTransform/>
</phone:LongListSelector.RenderTransform>
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<ListBoxItem Margin="0,6,0,6">
<StackPanel>
<TextBlock Text="{Binding Title}" TextWrapping="NoWrap" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeLarge}" Foreground="Black"/>
</StackPanel>
</ListBoxItem>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</Grid>
</Grid>
Here's the code that populates the list:
(DataContext as LibraryViewModel).SelectAlbum(album).ContinueWith((songs) => {
Dispatcher.BeginInvoke(() =>
{
music_tracks.ItemsSource = songs.Result;
VisualStateManager.GoToState(this, "Tracks", true);
});
});
All the SelectAlbum method above does now is return a list of newly created Song instances - no other processing is done, so this should not be any sort of performance hog. But still there is a huge delay in rendering.
I've turned off transitions in my visual state changes to no avail; the list still takes too long to load. I've also experimented by creating a fresh new project with a LLS inside of a Panorama, populating it with a button press to see the delay. It's almost instant. The only difference between that and my project seems to be the UserControl I've nested these lists inside of - can that be the cause of this bad performance?
Any suggestions are very much appreciated!
For good measure, here's the class of the item I'm rendering:
public class SongModel
{
public Guid SongID { get; set; }
//public string SongFingerPrint { get; set; }
public Guid OwnerId { get; set; }
public string SongMD5 { get; set; }
public string Title { get; set; }
public string Artist { get; set; }
public string Album { get; set; }
public int TrackNumber { get; set; }
public int DiscNumber { get; set; }
public int Year { get; set; }
public string Genre { get; set; }
public double Length { get; set; }
}

Why do you use LongListSelector? Have you seen this ?
I mean, if an amount of the items is fixed and you do not use grouping, should be enough to use ListBox. Did you try that?

ListBox not databinding

My ListBox control is working fine, except that the data to be bound is not displaying.
My XAML:
<ListBox x:Name="listFileNames" SelectionMode="Single" Margin="10">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Margin="5" Source="{Binding Path=Image}" Stretch="Fill" Width="50" Height="50"></Image>
<StackPanel Grid.Column="1" Margin="5">
<TextBlock Text="{Binding Path=FileName}" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Path=State}"></TextBlock>
<TextBlock Text="This text shows..."></TextBlock>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
My code:
public struct StyleDocumentFile
{
public string Image;
public string FileName;
public string State;
}
// ......
StyleDocumentFile sdf = new StyleDocumentFile()
{
Image = "/Images/Loading.png",
FileName = "abc",
State = "Extracting Data...",
};
this.listFileNames.Items.Add(sdf);

Change fields to Property. After this, all works fine.
public struct StyleDocumentFile
{
public string Image { get; set; }
public string FileName { get; set; }
public string State { get; set; }
}

You should set ItemsSource in ListBox definition like ItemsSource="{Binding Model.Items}". In addition you must call RaisePropertyChanged in setter of model properties.

Data Binding Help - WPF

I have those two classes:
class DownloadLink
{
public string Name { get; private set; }
public string Url { get; private set; }
//(...)
}
class DownloadGroup
{
public List<DownloadLink> Links { get; private set; }
//(...)
}
class Manager
{
public List<DownloadGroup> Groups { get; private set; }
}
Manager managerOBJ = new Manager();
I want to display this like that:
Everything will be in ListBox:
I wan to bind managerOBJ.Groups to that ListBox. - How to do it?
Than I want to create DataTamplate to display each group and all links in that group. - How to do it?
I want to do as much as possible from XAML
UPDATE:
This is what I got. It's not workig. List box is empty.
<ListBox DockPanel.Dock="Right" VerticalAlignment="Stretch" Width="500" HorizontalAlignment="Right" Background="#FFE1FFF5" HorizontalContentAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Visible" ItemsSource="{Binding Path=Groups}" Name="GroupsListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Height="30" VerticalAlignment="Top" Width="500" >
<Grid Height="Auto" Width="500">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Content="XX MB w XX plikach" HorizontalAlignment="Stretch" Margin="0"/>
</Grid>
<ListBox HorizontalAlignment="Stretch" Height="43" Margin="0,5,0,0" Width="Auto" VerticalAlignment="Top" ItemsSource="{Binding Path=Links}">
<ListBox.ItemTemplate>
<DataTemplate>
<Label Content="{Binding Path=Name}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
and in code behid I have:
RapideoAccount = new Rapideo();
GroupsListBox.DataContext = RapideoAccount;

The whole manager is contained in a listbox, for each downloadgroup in the manager you add an itemscontrol that contains another items control with the links in it.
This can be done by using DataTemplates:
<ListBox Name="myGroups"
ItemsSource="{Binding Path=Groups}">
<!-- each List<DownloadGroup> in the manager: -->
<ListBox.ItemTemplate>
<DataTemplate>
<ItemsControl ItemsSource="{Binding Path=Links}">
<!-- each Link in the Downloadgroup -->
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Path=Name}" />
<TextBlock Text="{Binding Path=Url}" />
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
In code you would put:
Manager managerOBJ = new Manager();
myGroups.DataContext = managerOBJ;

define managerOBJ as a property in your viewmodel
binding viewmodel to your view.
binding ListBox itemssource to managerOBJ.Groups.
define DataTemplate inside ListBox to display each DownloadGroup.