wpf check list box - c#

I m new to wpf.In order to get check list box functionality ,I have added below xaml to my code,but there is no output in my screen.only blank,what it could be?
<TabItem Header="Samples" >
<ListBox Margin="10" Width="373" Height="236">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="MyText"/>
<CheckBox IsChecked="False"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</TabItem>

just have a look at this basic sample
http://merill.net/2009/10/wpf-checked-listbox/

List box is a bit wired for such task..Have a look at ItemsControl.
Here is the code i use:
<ItemsControl
ItemsSource="{Binding ***}" IsTabStop="False">
<ItemsControl.ItemTemplate>
<DataTemplate>
<CheckBox
Content="{Binding Name}"
IsChecked="{Binding IsSelected}" />
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>

Replace your code with this
<TabItem Header="Roles" >
<ListBox Margin="10" Width="373" Height="236">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="MyText"/>
<CheckBox IsChecked="False"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBoxItem>Hi</ListBoxItem>
</ListBox>
</TabItem>
and tell us if it still shows blank

Better still, just use the new CheckListBox control in the Extended WPF Toolkit
http://wpftoolkit.codeplex.com/wikipage?title=CheckListBox&referringTitle=Home

This might help
1.Inorder to work datatemplate you must specify itemsource, here i have bounded a Stateslist a collection of items into it.
2.Also set the Datacontext to ViewModel or the CodeBehind as datacontext.
3.Datacontext will distribute the StateList properties collection to the listbox itemsource
using codebehind -
public Window1()
{
InitializeComponent();
this.DataContext = this;
LoadData();
}
using viewmodel
public Window1()
{
InitializeComponent();
DataContext = new Window1ViewModel();
LoadData();
}
//MyItemsource Property for listbox
private ObservableCollection<States> _stateslist;
public ObservableCollection<States> StatesList
{
get { return _stateslist; }
set
{
_stateslist = value;
RaisePropertyChanged(() => StatesList);
}
}
// Sample Data Loading
public void LoadData()
{
StatesList = new ObservableCollection<States>();
StatesList.Add(new States
{
StateName = "Kerala"
});
StatesList.Add(new States
{
StateName = "Karnataka"
});
StatesList.Add(new States
{
StateName = "Goa"
});
}
Window1.Xaml
<ListBox ItemsSource="{Binding StatesList}" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<CheckBox IsChecked="{Binding IsSelected"} Content="{Binding StateName}" />
<TextBox Text="{Binding TextBoxValue}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

Check this out it isworking..you are using TabItem but you didnt define it in TabControl
<TabControl>
<TabItem Header="Tab1">
<ListBox Margin="10" Width="373" Height="236">
<ListBox.Items>
<StackPanel Orientation="Horizontal">
<TextBlock Text="MyText"/>
<CheckBox IsChecked="False"/>
</StackPanel>
</ListBox.Items>
</ListBox>
</TabItem>
</TabControl>
If you are new in WPF use XamlPadX it will give you great help to practice out on it..

Related

Tabcontrol with different pages (included in xaml or extern page) as tabcontent

Hello and thanks for reading and maybe helping :-)
My Code below with statements.
I have my MainWindow.xaml in which I have my CheckBox and TabControl.
<CheckBox Grid.Column="8" Grid.Row="2" Name="checkBoxCommon" HorizontalAlignment="Right" VerticalAlignment="Center" IsChecked="{Binding IsCheckedCommon}"/>
<Grid Grid.Column="0" Grid.ColumnSpan="10" Grid.Row="4">
<TabControl ItemsSource="{Binding Path=DpConfigCol>
<TabControl.ItemTemplate>
<DataTemplate>
<ContentControl Content="{Binding Path=DpConfigName}>
<ContentControl.Resources>
<DataTemplate DataType="types:ConfigCommon">
</DataTemplate>
<DataTemplate DataType="types:ConfigAdress">
</DataTemplate>
</ContentControl.Resources>
</ContentControl>
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<ContentControl>
<ContentControl.Resources>
<DataTemplate DataType="types:ConfigCommon">
<TextBlock Text="hallo" Width="150"/>
</DataTemplate>
<DataTemplate DataType="types:ConfigAdress">
</DataTemplate>
</ContentControl.Resources>
</ContentControl>
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
If I tick my checkbox it will add a new model to my ObservableCollection().
private bool _isCheckedCommon;
public bool IsCheckedCommon
{
get { return _isCheckedCommon; }
set
{
_isCheckedCommon = value;
if (_isCheckedCommon == true)
{
DpConfigCol.Add(new ConfigCommon("Common"));
}
else
{
foreach (object item in DpConfigCol)
{
if (item.GetType().ToString()==typeof(ConfigCommon).FullName.ToString())
{
DpConfigCol.Remove(item);
break;
}
}
}
return;
}
}
I made a binding to my tabcontrol with this Collection called DpConfigCol.
And now my question:
How do I make the properties (from my model: ConfigCommon) visible in my tabcontrol.ContentTemplate? If there are more than one checkbox with even more Models?
Is there a way to implement in that Tabcontrol.contentTemplate more than one Template for more than one model?
TLDR; (read only the title)
I also had to develop an app that used tabs once. You can use <Frame> inside your tabs and set its Content to what ever XAML page you want

Issue binding grouped data to cvs for semantic zoom

I'm having some trouble getting my semantic zoom bind correctly to my CollectionViewSource. I'm pretty new to MVVM, so I'm not sure i have stuff setup correctly.
View Model
private async void GetData()
{
// Simulate pulling data from api
string response;
StorageFile file = await StorageFile.GetFileFromApplicationUriAsync(new Uri(#"ms-appx:///DesignData/GetLive.json"));
using (StreamReader sRead = new StreamReader(await file.OpenStreamForReadAsync()))
response = await sRead.ReadToEndAsync();
// Deserialize data to class
LiveStreamModel liveGames = JsonConvert.DeserializeObject<LiveStreamModel>(response);
Schedules = liveGames.schedule;
// Group data by event
var groupData = liveGames.schedule.GroupBy(a => a.#event);
// Set cvs source to grouped data
ScheduleSource = new CollectionViewSource() { IsSourceGrouped = true, Source = groupData };
}
private CollectionViewSource scheduleSource;
public CollectionViewSource ScheduleSource
{
get
{
return scheduleSource;
}
set
{
scheduleSource = value;
RaisePropertyChanged("ScheduleSource");
}
}
View
Page.Resources>
<DataTemplate x:Key="ZoomedInTemplate">
<StackPanel Orientation="Horizontal" MinWidth="200" Margin="12,6,0,6">
<!--<Image Source="{Binding ImagePath}" Height="80" Width="80"/>-->
<StackPanel Margin="20,0,0,0">
<TextBlock Text="{Binding homeTeam}" Style="{StaticResource BaseTextBlockStyle}"/>
<TextBlock Text="{Binding awayTeam}" TextWrapping="Wrap" HorizontalAlignment="Left" Width="300"
Style="{StaticResource BodyTextBlockStyle}"/>
</StackPanel>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="ZoomedInGroupHeaderTemplate">
<TextBlock Text="{Binding event}" Foreground="{ThemeResource ApplicationForegroundThemeBrush}"
Style="{StaticResource SubtitleTextBlockStyle}"/>
</DataTemplate>
<DataTemplate x:Key="ZoomedOutTemplate">
<TextBlock Text="{Binding event}" Style="{StaticResource SubtitleTextBlockStyle}"/>
</DataTemplate>
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<SemanticZoom x:Name="GetLiveZoom" >
<SemanticZoom.ZoomedInView>
<GridView x:Name="GetLiveGrid" ItemsSource="{Binding ScheduleSource.View}" ItemTemplate="{StaticResource ZoomedInTemplate}" SelectionMode="Single"
ScrollViewer.IsHorizontalScrollChainingEnabled="False">
<GridView.GroupStyle>
<GroupStyle HeaderTemplate="{StaticResource ZoomedInGroupHeaderTemplate}" />
</GridView.GroupStyle>
</GridView>
</SemanticZoom.ZoomedInView>
<SemanticZoom.ZoomedOutView>
<GridView x:Name="GetLiveList" ItemsSource="{Binding ScheduleSource.View.CollectionGroups}" ItemTemplate="{StaticResource ZoomedOutTemplate}" SelectionMode="None"
ScrollViewer.IsVerticalScrollChainingEnabled="False"/>
</SemanticZoom.ZoomedOutView>
</SemanticZoom>
</Grid>
When debugging, my data is getting grouped properly by #event, but setting the source of the cvs to the grouped data and binding that to the semantic zoom control results in nothing showing up.
You need to fix the following data binding:
1) For ZoomedInGroupHeaderTemplate, because the Source is grouped data, so if you want to show the group name in ZoomedInView, set data binding for Key property:
<DataTemplate x:Key="ZoomedInGroupHeaderTemplate">
<TextBlock Text="{Binding Key}" Foreground="{ThemeResource ApplicationForegroundThemeBrush}"
Style="{StaticResource SubtitleTextBlockStyle}"/>
</DataTemplate>
2) For ZoomedOutTemplate, the Source is ICollectionView.CollectionGroups, ref MSDN -> ICollectionViewGroup interface
We need to use ICollectionViewGroup.Group property to get group name in ZoomedOutView:
<DataTemplate x:Key="ZoomedOutTemplate">
<TextBlock Text="{Binding Group.Key}" Style="{StaticResource SubtitleTextBlockStyle}"/>
</DataTemplate>
Check my completed sample in Github
Screenshot for ZoomedInView:
Screenshot for ZoomedOutView:

ListBox SelectedItem does not work in MVVM

Hello I have strage issue with SelectedItem property of ListBox. It just does not work.
Here is my code:
XAML:
<TabControl HorizontalAlignment="Left" Margin="10,50,0,0" VerticalAlignment="Top" ItemsSource="{Binding WszystkieFilmy}" >
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Key}"/>
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<ListBox HorizontalAlignment="Left" Height="500" VerticalAlignment="Top" Width="750" ItemsSource="{Binding Value.Filmy}" SelectedItem="{Binding Path=WybranyFilm, Mode=TwoWay}"/>
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
ViewModel:
public Film WybranyFilm
{
get { return zaznaczonyFilm; }
set
{
if (value != zaznaczonyFilm)
{
zaznaczonyFilm = value;
OnPropertyChanged("WybranyFilm");
}
}
}
public Dictionary<String, ListaFilmow> WszystkieFilmy
{
get { return wszystkieFilmy; }
set
{
if (wszystkieFilmy == value)
{
return;
}
wszystkieFilmy = value;
OnPropertyChanged("WszystkieFilmy");
}
}
And "Value.Filmy" is: ObservableCollection
When I select any of item in ListBox it is not assign to "WybranyFilm" variable. I have no idea what is the reason. I have used almost the same solution in other view and it works perfectly. The only difference is that I have ListBox alone there, it is not a part of TabControl.
Looks like the DataContext is incorrect for SelectedItem.
<TabControl x:Name="TabControl" HorizontalAlignment="Left" Margin="10,50,0,0" VerticalAlignment="Top" ItemsSource="{Binding WszystkieFilmy}" >
<TabControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Key}"/>
</DataTemplate>
</TabControl.ItemTemplate>
<TabControl.ContentTemplate>
<DataTemplate>
<ListBox HorizontalAlignment="Left" Height="500" VerticalAlignment="Top" Width="750" ItemsSource="{Binding Value.Filmy}" SelectedItem="{Binding ElementName=TabControl, Path=WybranyFilm, Mode=TwoWay}"/>
</DataTemplate>
</TabControl.ContentTemplate>
</TabControl>
Simply write:
SelectedItem="{Binding WybranyFilm}"
Make sure your Model is set as View's DataContext.

Bind .sdf query to listbox

Can anyone help me with this problem i want to bind the following results.
public IList<bankingCategory> bankingInfo()
{
IList<bankingCategory> bankList = null;
using (dataContext context = new dataContext(globalInfo.strConnectionString))
{
IQueryable<bankingCategory> query = from c in context.bankcategorees select c;
bankList = query.ToList();
}
return bankList;
}
set item source from code behind
MyListBox.ItemsSource =bankingInfo();
You need to set customize your list box template like below
<Grid>
<ListBox Name="MyListBox">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=Property1}"></TextBlock>
<TextBlock Text="{Binding Path=Property2}"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>

Data binding to Listbox from JSON Response

This is the first time i am doing xaml so please understand that I might be slow in learning
Below is my CS codes. I am trying to bind the "attributes" to listbox.
public DirectionPage()
{
InitializeComponent();
List<Feature> features = App.dResult.directions[0].features;
foreach (Feature f in features)
{
Attributes a = f.attributes;
MessageBox.Show(a.text);
}
}
public ObservableCollection<Feature> test = new ObservableCollection<Feature>();
Below is the XAML codes.
<ListBox x:Name="directionListBox" ItemsSource="{Binding}" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding text}" Style="{StaticResource PhoneTextTitle2Style}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Any help will be greatly appreciated.
I didn't see the collection of attributes.
Possibly what you can do is collect the attributes in a list may be your test and put it in the biding.
Or put the Features collection as itemsource of your list box.
i.e.
public DirectionPage()
{
InitializeComponent();
List<Attributes> LAtributes=new List<Attributes>();
List<Feature> features = App.dResult.directions[0].features;
foreach (Feature f in features)
{
Attributes a=new Attributes();
a = f.attributes;
LAttributes.add(a);
MessageBox.Show(a.text);
}
directionListBox.ItemsSource=Lattribute;
}
and
<ListBox x:Name="directionListBox" ItemsSource="{Binding}" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Path=text}" Style="{StaticResource PhoneTextTitle2Style}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Hopefully this will help you!

Categories