I've checked various examples of Pivots and think my implementation should work but it's having an issue.
Here is the XAML:
<controls:Pivot Title="Results" ItemsSource="{Binding baskets}">
<controls:Pivot.HeaderTemplate>
<DataTemplate>
<Grid x:Name="grid">
<TextBlock Text="{Binding basketName}" />
</Grid>
</DataTemplate>
</controls:Pivot.HeaderTemplate>
<controls:Pivot.ItemTemplate>
<DataTemplate>
<Grid>
<StackPanel Orientation="Vertical">
<TextBlock TextWrapping="Wrap" Text="{Binding basketItems.Count}"/>
</StackPanel>
</Grid>
</DataTemplate>
</controls:Pivot.ItemTemplate>
</controls:Pivot>
and the code-behind:
public ObservableCollection<Basket> baskets = new ObservableCollection<Basket>();
public pivotPage()
{
InitializeComponent();
//for testing purposes
baskets.Add(new Basket());
baskets.Add(new Basket());
}
The page renders blank, what am I doing wrong?
There is no indication in your code that you have set your DataContext. Try the following:
public ObservableCollection<Basket> baskets = new ObservableCollection<Basket>();
public pivotPage()
{
InitializeComponent();
this.DataContext = baskets;
//for testing purposes
baskets.Add(new Basket());
baskets.Add(new Basket());
}
Related
Currently Developing an UWP Application having troubles with comboboxes.
I am binding an ObservableCollection to a combobox (it works)
var WarehouseList = new ObservableCollection<Warehouse>(taskmag.Result);
WarehouseBox.ItemsSource = WarehouseList;
What I would like to do is to show a selecteditem when I load data into my form.
I am not using MVVM and this is my Combox XAML
<ComboBox HorizontalAlignment="Stretch" Width="400" FontSize="32" Name="WarehouseBox" Margin="20,0,0,0">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Width="Auto" Height="Auto">
<TextBlock Text="{Binding Name}"/>
<TextBlock Text="{Binding WarehouseID}" Name="MID" Visibility="Collapsed"/>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
I have no idea where to start from as documentation always implies MVVM or some other thing I have not implemented.
I am willing to change my items coll to List or IEnumerable if it can help solve the issue.
Any help is greatly appreciated.
Here's the full thing, let me know if it still doesn't work for you:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ComboBox x:Name="ComboBoxWarehouses">
<ComboBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Width="Auto" Height="Auto">
<TextBlock Text="{Binding Name}"/>
</StackPanel>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
</Grid>
public MainPage()
{
this.InitializeComponent();
var items = new ObservableCollection<Warehouse>();
var item = new Warehouse() {Name = "selected"};
items.Add(new Warehouse() { Name = "not selected"});
items.Add(item);
items.Add(new Warehouse() { Name = "Another Not Selected"});
ComboBoxWarehouses.ItemsSource = items;
ComboBoxWarehouses.SelectedItem = item;
}
I use an observableCollecion in my VM. This Collection is bind into my view in a ListView. In my items I try to get the element who create this item. Add it in my commandParameter and do the thing.
Here's my VM :
public RelayCommand<SelectionCommandParameter> CmdRemoveFromQuiz { get; set; }
public ObservableCollection<Question> SelectedQuiz
{
get { return _selectedQuiz; }
set
{
_selectedQuiz = value;
RaisePropertyChanged("SelectedQuiz");
}
}
private void RemoveFromQuiz(SelectionCommandParameter selection)
{
if (selection.Parameter is Question)
{
ObservableCollection<Question> tempQuiz = SelectedQuiz;
Question _question = (Question)selection.Parameter;
tempQuiz.Remove(_question);
SelectedQuiz = tempQuiz;
}
}
The problem start with the RemoveBtn I start the command, and selection stay null I want to get the ObservableCollection<Question> object use in my ListViewitem
Now My View :
<userControls:CharmFlyout
x:Name="cfoQuizList"
x:Uid="QuizListCreatingPageFlyout"
Heading="Question Multiple"
HorizontalAlignment="Left"
Grid.Column="0"
Grid.RowSpan="2"
Style="{StaticResource stlAddRecipientFlyout}">
<tut:TutorialAwareListView x:Name="gvQuizItem"
ItemsSource="{Binding SelectedQuiz}"
IsItemClickEnabled="True"
CanReorderItems="True"
SelectionMode="None"
ManipulationMode="TranslateRailsX">
<ListView.ItemTemplate>
<DataTemplate x:Name="DTQuizItem">
<Grid HorizontalAlignment="Left" Width="{StaticResource RectangleTileWidth}" Height="{StaticResource RectangleTileHeight}"
Margin="0 0 0 0" Background="{StaticResource OrangeBackgroundThemeBrush}">
<Grid Grid.Column="1">
<Button x:Name="RemoveBtn" Content="X" HorizontalAlignment="Right" VerticalAlignment="Top" Width="40" Height="40"
BorderThickness="0" Command="{Binding DataContext.CmdRemoveFromQuiz, ElementName=gvQuizItem}" CommandParameter="{Binding Question}"/>
<maxCtrls:MaxAutoScrollingContentPresenter VerticalAlignment="Center"
ScrollingDuration="{Binding Name, Converter={StaticResource TextToTimeToReadShortFormatConverter}}"
ScrollingBeginTime="0:0:2">
<TextBlock Text="{Binding Name}" FontWeight="SemiBold"
Foreground="{StaticResource WhiteBackground}"
Margin="20,5,10,5" VerticalAlignment="Center" TextWrapping="Wrap"/>
</maxCtrls:MaxAutoScrollingContentPresenter>
</Grid>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</tut:TutorialAwareListView>
</userControls:CharmFlyout>
The TutorialAwareListView Work exactly like a ListView. I use it juste to point the element while the tutorial is running.
It's a Windows Store App !! I can't do all the thing we would like to.
You should change your SelectionMode="None" to Single or Multiply.
And make new ObservableCollection for selected items. You bind just ItemsSource="{Binding SelectedQuiz}". Bind SelectedItems="{...}"
I have a DataGrid and fill it with a DataTable.
dgMitarbeiter.ItemsSource = mainController.loadDataTableMitarbeiter().DefaultView;
this is the function:
public DataTable loadDataTableMitarbeiter()
{
loadMitarbeiterList();
dtMitarbeiter.Clear();
foreach (Mitarbeiter mitarbeiter in mitarbeiterList)
{
drMitarbeiter = dtMitarbeiter.NewRow();
drMitarbeiter["ID"] = mitarbeiter.ID;
drMitarbeiter["Vorname"] = mitarbeiter.vorname;
drMitarbeiter["Nachname"] = mitarbeiter.nachname;
drMitarbeiter["Kostenstelle"] = mitarbeiter.kostenstelle.id;
drMitarbeiter["Größe Hose"] = mitarbeiter.gr_hose;
drMitarbeiter["Größe Oberteil"] = mitarbeiter.gr_oberteil;
drMitarbeiter["Gröse Schuhe"] = mitarbeiter.gr_schuhe;
drMitarbeiter["Ferial"] = mitarbeiter.ferial;
drMitarbeiter["Werk"] = mitarbeiter.werk;
drMitarbeiter["Datum"] = mitarbeiter.creationDate.ToString("dd.MM.yyyy");
dtMitarbeiter.Rows.Add(drMitarbeiter);
}
return dtMitarbeiter;
}
The Xaml:
<DataGrid x:Name="dgMitarbeiter" AlternatingRowBackground="Gainsboro" AlternationCount="2" ColumnWidth="*" HorizontalAlignment="Left" SelectedItem="{Binding SelectedItem}" Margin="10,22,0,0" VerticalAlignment="Top" Height="357" Width="731" CanUserAddRows="False" CanUserDeleteRows="False" RowEditEnding="dgMitarbeiter_RowEditEnding" Background="White" HeadersVisibility="Column"/>
I need a ComboBox for the column "Kostenstelle" but have no idea how to achieve this. Any ideas?
My answer implements an ObservableCollection. And adds this as a databinding to the ComboBox
You need a new class:
public class Kostenstellen: ObservableCollection<Kostenstelle>
{
}
And a fill Method with the following lines of code:
var kostenstellen = new Kostenstellen();
foreach mitarbeiter in mitarbeiterList
{
kostenstellen.Add(mitarbeiter.kostenstelle);
}
var cvsCombobox = new CollectionViewSource() { Source = this.operationList };
this.myCombobox.SetBinding(ItemsControl.ItemsSourceProperty, new Binding() { Source = cvsCombobox });
Now there will be only "(Kostenstelle)" as a string in the Combobox.
So you need to override the ToString() method of your Kostenstelle class
public partial class Kostenstelle
{
public override string ToString()
{
return this.ID.ToString();
}
}
HINT:
Use english variable and class names next time :)
You need to define a DataGridComboBoxColumn in your DataGrid columns, you can then bind the ItemsSource to wherever your combo box's options are located.
See here.
You can do a lot in your xaml file :) For myself I used this one lately...
In the xaml file you can now define the placement of the combobox on your page.
you can set the content by code later.
<GridView
x:Name="itemGridView"
AutomationProperties.AutomationId="ItemGridView"
AutomationProperties.Name="Items In Group"
TabIndex="1"
Grid.RowSpan="2"
Padding="120,126,120,50"
ItemsSource="{Binding}"
SelectionMode="None"
IsSwipeEnabled="false"
IsItemClickEnabled="True"
ItemClick="ItemView_ItemClick"
>
<GridView.ItemTemplate >
<DataTemplate >
<Grid Height="150" Width="480" Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="10,10,0,0" >
<TextBlock Text="{Binding title}" Style="{StaticResource TitleTextBlockStyle}" TextWrapping="NoWrap" FontSize="25"/>
<Line/>
<TextBlock Text="{Binding subtitle}" Style="{StaticResource CaptionTextBlockStyle}" TextWrapping="NoWrap" FontSize="20" Margin="0,10,0,0" />
<Line/>
<TextBlock Text="{Binding description}" Style="{StaticResource BodyTextBlockStyle}" MaxHeight="60" FontSize="15" Margin="0,10,0,0"/>
<Button Tag="{Binding title}" Click="ItemButtonClicked" Content="Details" FontSize="15" Margin="0,10,0,0"/>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemContainerStyle>
<Style TargetType="FrameworkElement" >
<Setter Property="Margin" Value="52,0,0,2"/>
</Style>
</GridView.ItemContainerStyle>
</GridView>
I followed the tutorial on this page: http://modernography.wordpress.com/2014/04/26/jumplists-in-windows-phone-8-1/
I have a collectionviewsource:
// artistdata
public CollectionViewSource ArtistList
{
get
{
var data = App.musicdata.Artists;
var groups = data.ToAlphaGroups(x => x.name);
_ArtistList = new CollectionViewSource();
_ArtistList.Source = groups; //groups is the result of using my extension methods above
_ArtistList.IsSourceGrouped = true;
return _ArtistList;
}
}
Which I bind to my XAML:
<PivotItem x:Name="artists" Margin="10,0">
<SemanticZoom Style="{StaticResource AlphaJumpListStyle}">
<SemanticZoom.ZoomedInView>
<ListView Background="Transparent" ItemsSource="{Binding ArtistList.View}" Loaded="ListviewLoaded">
<ListView.GroupStyle>
<GroupStyle HeaderTemplate="{StaticResource AlphaGroupHeaderTemplate}" HeaderContainerStyle="{StaticResource JumpListListHeaderContainerStyle}" HidesIfEmpty="True" />
</ListView.GroupStyle>
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Grid.Column="1" Margin="10,5" Tapped="ArtistSelected">
<TextBlock FontFamily="Segoe WP" FontSize="22" Foreground="White" Text="{Binding name}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="{Binding ActualWidth, ElementName=parentElementName}"/>
<TextBlock FontFamily="Segoe WP" FontWeight="Light" FontSize="17" Foreground="#7FFFFFFF" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,-5,0,0">
<Run Text="{Binding amountofalbums}"/>
<Run Text="albums"/>
</TextBlock>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</SemanticZoom.ZoomedInView>
<SemanticZoom.ZoomedOutView>
<GridView ItemsSource="{Binding ArtistList.View.CollectionGroups}" Style="{StaticResource AlphaJumpListPickerStyle}" />
</SemanticZoom.ZoomedOutView>
</SemanticZoom>
</PivotItem>
It all displays correctly, I can open and close the JumpList.
BUT, when I tap on a letter in the zoomedoutview, the zoomedinview doesn't jump to that letter. Instead, it stays where it was?
I can't find the cause for this problem. Maybe the problem is that the SementicZoom is inside a Pivot?
I think the issue is caused because ListView and GridView are obtaining different instances of CollectionView. As the example shows, you should cache the first created instance.
The code should be:
public CollectionViewSource ArtistList
{
get
{
if(_ArtistList == null)
{
var data = App.musicdata.Artists;
var groups = data.ToAlphaGroups(x => x.name);
_ArtistList = new CollectionViewSource();
_ArtistList.Source = groups; //groups is the result of using my extension methods above
_ArtistList.IsSourceGrouped = true;
}
return _ArtistList;
}
}
XAML:
<toolkit:ListPicker Name="SourceAccountList" Width="680" FontSize="20" Height="50">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding AccountIban}" />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
</toolkit:ListPicker>
Code:
public TransferInternal()
{
InitializeComponent();
Service1Client WCFClient = new ServiceReference1.Service1Client();
WCFClient.GetSourceAccountIntenalListCompleted += new EventHandler<GetSourceAccountIntenalListCompletedEventArgs>(WCFClient_GetSourceAccountIntenalListCompleted);
WCFClient.GetSourceAccountIntenalListAsync(GlobalVariables.ClientID);
}
void WCFClient_GetSourceAccountIntenalListCompleted(object sender, GetSourceAccountIntenalListCompletedEventArgs e)
{
List<AccountModel> AccountList = new List<AccountModel>();
foreach (var ListItem in e.Result)
{
AccountModel Account = new AccountModel();
Account.AccountID = ListItem.AccountID;
Account.AccountIban = ListItem.AccountIban;
AccountList.Add(Account);
}
SourceAccountList.ItemsSource = AccountList;
}
When I try to select something in SourceAccountList it displays object name instead of its properties values. What am doing wrong? I found similar problem
ListPicker shows object name instead of property
But I'm doing the same thing.
You would have to Make the FullModeItemTemplate Like this
<toolkit:ListPicker Name="SourceAccountList" Width="680" FontSize="20" Height="50">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding AccountIban}" />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding AccountIban}" />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
List picker has two kinds of itemTemplate the "normal" that displays when you have when you have less than 5 items and the "Full Mode" that displays when you have more than 5.
to create a FullModeItemTemplate you should do something like this
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<TextBlock FontSize="30" Text="{Binding AccountIban}"/>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
The simplest solution is to override the ToString() method in the AccountModel class
public override string ToString()
{
return this.AccountIban;
}