When App opens, selectedItem of the ListPicker namely, "BackgroundColor" must be from variable. How to achieve this?
XAML:
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Name="PickerItemTemplate">
<TextBlock Text="{Binding BackGroundColorString}" />
</DataTemplate>
<DataTemplate x:Name="PickerFullModeItemTemplate" >
<Grid x:Name="rootGrid" Margin="0">
<StackPanel Orientation="Horizontal" Margin="0 14 0 0" HorizontalAlignment="Center">
<TextBlock Name="BackgroundColor"
Text="{Binding BackGroundColorString}"
FontSize="35"
Margin="10,10"
TextAlignment="Center"
FontFamily="/Assets/Fonts/AGENCYR.TTF#Agency FB"
/>
</StackPanel>
</Grid>
</DataTemplate>
</phone:PhoneApplicationPage.Resources>
<toolkit:ListPicker x:Name="BackgroundColor" FullModeHeader="Select Background Color:"
Header="Background Color:" BorderThickness="0"
FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}"
ItemTemplate="{StaticResource PickerItemTemplate}" Background="#FF09043C"
SelectionChanged="BackgroundColor_SelectionChanged" >
</toolkit:ListPicker>
C#:
public class BackGroundlistPickerClass
{
public string BackGroundColorString
{
get;
set;
}
}
List<BackGroundlistPickerClass> BackGroundColorList = new List<BackGroundlistPickerClass>();
public void ImplementListPickeritems() //Listpickers
{
BackGroundColorList.Add(new BackGroundlistPickerClass() { BackGroundColorString = "White (Default)" });
BackGroundColorList.Add(new BackGroundlistPickerClass() { BackGroundColorString = "Black" });
BackGroundColorList.Add(new BackGroundlistPickerClass() { BackGroundColorString = "Light Grey" });
}
string PreSelectedColor="Black";
private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{
BackgroundColor.SelectedItem=PreSelectedColor; // ERROR COMES ON THIS LINE
}
BackgroundColor.SelectedItem is not working because, items in BackgroundColor are acutaly from Class/List. Now how to set BackgroundColor listpicker to Black(PreSelectedColor) whenever the page opens?
You need to set SelectedItem to an item from the ItemsSource. You can try this way, assuming that BackGroundColorList property used for ItemsSource :
string PreSelectedColor="Black";
private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{
var defaultColor =
BackGroundColorList.FirstOrDefault(o => o.BackGroundColorString == PreSelectedColor);
BackgroundColor.SelectedItem = defaultColor;
}
Related
I am trying to update a data-binded list view.
This is the desired behaviour:
The user writes the title of the item he/she likes to add to the list and submits his input with the enter key.
The list should update, but it doesn't.
private void NewSubject_KeyDown(object sender, KeyEventArgs e)
{
if (e.Key == Key.Enter)
{
TextBox newSubject = sender as TextBox;
Subjects.Add(new Subject { Title = newSubject.Text });
SubjectsList.ItemsSource = Subjects;
newSubject.Text = "";
}
}
this is the xaml code excerpt:
<DockPanel Margin="4">
<TextBox x:Name="NewSubject" KeyDown="NewSubject_KeyDown" DockPanel.Dock="Bottom" Margin="0 8 0 0" Padding="4" />
<ListView Name="SubjectsList" ItemsSource="{Binding Subjects}" DockPanel.Dock="Bottom">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Title}" />
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</DockPanel>
Where could be my mistake?
I have a LongListSelector with some textblocksand images inside.
How can I set the Image's visibility programmatically?
I have them set to collapsed and I want to enable them on selection_changed event of the LongListSelector.
XAML:
<phone:LongListSelector Name="LongListSel" Margin="0,-38,-22,2" ItemsSource="{Binding Items}" SelectionChanged="LongListSelector_SelectionChanged">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="12,2,0,4" Height="110" Width="432">
<StackPanel Width="311" Margin="0,0,0,0">
<TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Margin="10,0" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="{StaticResource PhoneFontSizeLarge}" />
<TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="10,-2,10,0" Style="{StaticResource PhoneTextSubtleStyle}" />
</StackPanel>
<StackPanel Name="playImage" Height="50" Width="50" Margin="0,0,10,0">
<Image Source="Assets/Tiles/Iconsmind-Outline-Play-Music.ico" Visibility="{Binding ImageVis}" Width="50" Height="50" HorizontalAlignment="Left" Tap="Image_Tap_1"/>
</StackPanel>
<StackPanel Name="downloadImage" Height="50" Width="50" Margin="0,0,0,0">
<Image Source="Assets/Tiles/Download.ico" Visibility="{Binding ImageVis}" Width="50" Height="50" HorizontalAlignment="Left" Tap="Image_Tap_1"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</phone:PanoramaItem>
selection changed event:
private void LongListSelector_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
ItemViewModel item = new ItemViewModel();
item.ImageVis = Visibility.Visible;
//it can't be called the way you are doing it of course and it still doesn't work
}
ViewModel
private Visibility _imageVis;
public Visibility ImageVis
{
get { return _imageVis; }
set
{
_imageVis = value;
NotifyPropertyChanged("ImageVis");
}
}
Create a property of type Visibility an bind it to your image visibility.
ViewModel:
private Visibility _DownloadImage;
public Visibility DownloadImage
{
get { return _DownloadImage; }
set
{
if (_DownloadImage != value)
{
_DownloadImage = DownloadImage;
OnPropertyChanged("DownloadImage");
}
}
}
xaml
<Image Source="Assets/Tiles/Download.ico" Visibility="{Binding DownloadImage}" ... />
xaml.cs (I would prefer to bind the command also to the ViewModel, to keep the MVVM pattern)
private void LongListSelector_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
DownloadImage = Visibility.Visible;
}
I want to make this as, once i select the first item(Student Information) of the first_ComboBox want to appear second_ComboBox.
How can I make this happen
In the cs code
private void first_ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
}
private void second_ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
}
in XAML
<StackPanel Margin="97,47,171,499" Orientation="Horizontal" Grid.Row="1">
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Where You want to Control" VerticalAlignment="Top" Height="82" Width="463" FontSize="36"/>
<ComboBox x:Name="first_ComboBox" HorizontalAlignment="Left" VerticalAlignment="Top" Width="560" Height="42" SelectionChanged="first_ComboBox_SelectionChanged">
<x:String>Student Information</x:String>
<x:String>Staff Information</x:String>
<x:String>Academic Information</x:String>
</ComboBox>
</StackPanel>
<StackPanel Margin="97,172,171,374" Orientation="Horizontal" Grid.Row="1">
<TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Select the Field" VerticalAlignment="Top" Height="82" Width="463" FontSize="36"/>
<ComboBox x:Name="second_ComboBox" HorizontalAlignment="Left" VerticalAlignment="Top" Width="560" Height="42" SelectionChanged="second_ComboBox_SelectionChanged">
<x:String>Student Name</x:String>
<x:String>Student Address</x:String>
</ComboBox>
</StackPanel>
On your Form main, you can set the visibility of Second Combobox to be false, and then on the first combobox selection changed set it to true, Something like this
public MainWindow()
{
InitializeComponent();
second_ComboBox.Visibility = Visibility.Collapsed;
}
private void first_ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
var selecteditem = first_ComboBox.SelectedItem as string;
if (selecteditem != null)
{
second_ComboBox.Visibility = Visibility.Visible;
}
}
on initialization make second combobox visiblity hidden
public MainWindow()
{
InitializeComponent();
second_ComboBox.Visibility = Visibility.Collapsed;
}
private void first_ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
first_ComboBox.Visibility = System.Windows.Visibility.Visible;
}
When I adding Genre of book by Listpicker, it's successful but when I choose the Book title in Listbox in order to show the details of Book, the value of Genre does not pass. What I want is in detail page, Genre is showed in Listpicker (as in Add page) and show the Genre I had chosen before
Addpage.xaml
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Name="listpickertemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Genre}" Margin="10 0 0 0" />
</StackPanel>
</DataTemplate>
<Grid x:Name="ContentPanel1" Grid.Row="1" >
<ListBox x:Name="BookInfo" >
<TextBlock Text="Book Title: *" FontWeight="Normal" FontStyle="Normal" Style="{StaticResource PhoneTextTitle3Style}" />
<TextBox x:Name="booktitletext" Width="460" TextWrapping="Wrap"/>
<TextBlock Text="Genre: *" FontWeight="Normal" FontStyle="Normal" Style="{StaticResource PhoneTextTitle3Style}" />
<toolkit:ListPicker x:Name="ListPicker" ItemTemplate="{StaticResource listpickertemplate}" Width="120" HorizontalAlignment="Left"/>
</ListBox>
</Grid>
The code behind Addpage:
public AddingPage()
{
InitializeComponent();
this.DataContext = App.MainViewModel;
List<GenrePicker> newpicker = new List<GenrePicker>();
newpicker.Add(new GenrePicker() { Genre = "Comedy",Index = 0 });
newpicker.Add(new GenrePicker() { Genre = "Science",Index = 1 });
newpicker.Add(new GenrePicker() { Genre = "Action", Index = 2 });
this.ListPicker.ItemsSource = newpicker;
}
private void Add_Click(object sender, EventArgs e)
{
if (booktitletext.Text.Length > 0)
{
Book newbook = new Book
{
BookTitle = booktitletext.Text,
Genre = (ListPicker.SelectedItem as GenrePicker).Genre.ToString(),
}
App.MainViewModel.Addinfo(newbook);
}
}
In my Browsepage.xaml, I just show the title of the book
<Grid x:Name="ContentPanel1" Margin="12,0,12,0">
<ListBox x:Name="TitleList" SelectionChanged="TitleList_SelectionChanged" ItemsSource="{Binding Load0}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Width="466" Margin="0, 0, 0, 12">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10"/>
<ColumnDefinition Width="360"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0"></Grid>
<StackPanel Grid.Column="1">
<TextBlock FontSize="40" Text="{Binding BookTitle}" FontWeight="Normal" FontStyle="Normal" Style="{StaticResource PhoneTextTitle3Style}" TextWrapping="Wrap"/>
</StackPanel>
<Grid Grid.Column="2">
<Button x:Name="Deletebutton" Height="50" Width="50" Click="deleteButton_Click" BorderBrush="{StaticResource TransparentBrush}" Margin="-40">
<Image Source="/Assets/delete.dark.png" Height="50" Width="50" Visibility="{StaticResource PhoneDarkThemeVisibility}" Margin="-40" />
</Button>
</Grid>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
The code behind of Browsepage when i choose a book title:
private void TitleList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
// If no Book is selected, just return
if (TitleList.SelectedIndex== -1) return;
// Get the parent application that contains the Book being edited
App thisApp = Application.Current as App;
// Set this to the selected customer
thisApp.SelectedBook = TitleList.SelectedItem as Book;
thisApp.SelectedGenre = TitleList.SelectedItem as GenrePicker;
// Navigate to the detail page
NavigationService.Navigate(new Uri("/View/DetailPage/BookDetail.xaml",UriKind.RelativeOrAbsolute));
TitleList.SelectedIndex = -1;
}
And the Bookdetails.xaml:
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" >
<ListBox x:Name="BookDetails">
<TextBlock x:Name="booktitle" Text="Book Title:" Foreground="#FF3B12AA" FontSize="30" FontWeight="Bold" FontFamily="Courier New"/>
<TextBox x:Name="booktitletext" Text="{Binding BookTitle, Mode=TwoWay}" Width="460" TextWrapping="Wrap" Background="#BF22A1DC" BorderBrush="#BFFFFFFF" FontFamily="Tahoma" FontSize="26"/>
<TextBlock x:Name="author" Text="Author:" Foreground="#FF3B12AA" FontSize="30" FontWeight="Bold" FontFamily="Courier New"/>
<TextBox x:Name="authortext" Tap="authortext_Tap" Text="{Binding Author, Mode=TwoWay}" Width="460" TextWrapping="Wrap" Background="#BF22A1DC" BorderBrush="#BFFFFFFF" FontFamily="Tahoma" FontSize="26"/>
<TextBlock x:Name="genre" Text="Genre:" Foreground="#FF3B12AA" FontSize="30" FontWeight="Bold" FontFamily="Courier New"/>
<toolkit:ListPicker x:Name="ListPicker" ItemTemplate="{StaticResource listpickertemplate}" Width="120" HorizontalAlignment="Left" Background="#BF3BDC22" SelectedIndex="{Binding Index}"/>
</ListBox>
</Grid>
the code-behind Bookdetails page:
public BookDetail()
{
InitializeComponent();
this.DataContext = App.MainViewModel;
List<GenrePicker> newpicker = new List<GenrePicker>();
newpicker.Add(new GenrePicker() { Genre = "Comedy",Index = 0});
newpicker.Add(new GenrePicker() { Genre = "Science", Index = 1 });
newpicker.Add(new GenrePicker() { Genre = "Action", Index = 2});
this.ListPicker.ItemsSource = newpicker;
}
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
// Get the parent application
App thisApp = Application.Current as App;
// Load the active customer into the viewmodel
App.MainViewModel.LoadDetails(thisApp.SelectedBook,thisApp.SelectedGenre);
}
and this is the Loadtails function
public void LoadDetails(Book bcd,GenrePicker xyz)
{
Index = xyz.Index;
BookTitle = bcd.BookTitle;
Genre = bcd.Genre;
}
I have try emulate it but it show error when I choose the booktile System.InvalidOperationException: SelectedIndex must always be set to a valid value.
at this.DataContext = App.MainViewModelof Bookdetails Page
My guess, the problem is your code setting DataContext (which means setting ListPicker's selected index too) before populating ListPicker's ItemsSource. That will cause selecting a non-existent -yet- Item of the ListPicker. Try to reorder codes to populate ListPicker before setting DataContext :
public BookDetail()
{
InitializeComponent();
List<GenrePicker> newpicker = new List<GenrePicker>();
newpicker.Add(new GenrePicker() { Genre = "Comedy",Index = 0});
newpicker.Add(new GenrePicker() { Genre = "Science", Index = 1 });
newpicker.Add(new GenrePicker() { Genre = "Action", Index = 2});
this.ListPicker.ItemsSource = newpicker;
this.DataContext = App.MainViewModel;
}
Instead of SelectedIndex = -1, try SelectedItem = null, which makes more sense.
When you set SelectedIndex = -1, you tell the ListPicker, "Hey, go find the -1'th element in your list and set that as selected." Then your ListPicker crashes because it doesn't understand what ListPicker[-1] means.
Here is my xaml of the Panorama page item.
<controls:PanoramaItem x:Name="deeln" Header="Deelnemers" Style="{StaticResource subtitle}">
<!--Double line list with image placeholder and text wrapping-->
<ListBox Margin="12,0,-12,0" ItemsSource="{Binding ItemsDeelnemer}" x:Name="lbDeelnemer" SelectionChanged="lbDeelnemer_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Disabled">
<StackPanel Orientation="Horizontal" Margin="0,0,0,17">
<TextBlock Foreground="Black" TextWrapping="Wrap" Text="{Binding LineNr}" Style="{StaticResource PhoneTextExtraLargeStyle}" ></TextBlock>
<StackPanel Width="430" Height="100">
<TextBlock Foreground="Black" TextWrapping="Wrap" Text="{Binding LineNaamWielrenner1}" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="35"></TextBlock>
<TextBlock Foreground="Black" TextWrapping="Wrap" Text="{Binding LineNaamWielrenner2}" Style="{StaticResource PhoneTextExtraLargeStyle}" FontSize="35"></TextBlock>
</StackPanel>
</StackPanel>
</ScrollViewer>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</controls:PanoramaItem>
Here is my code in the Panorama page.
private void lbDeelnemer_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
#region go to specific deelnemerinfo screen
// If selected index is -1 (no selection) do nothing
if (lbDeelnemer.SelectedIndex == -1)
return;
// Navigate to the new page
if (lbDeelnemer.SelectedIndex == 0)
{
NavigationService.Navigate(new Uri("/DeelnemerInfo.xaml", UriKind.Relative));
//NavigationService.Navigate(new Uri("/DeelnemerInfo.xaml?selectedItem=" + lbDeelnemer.SelectedIndex, UriKind.Relative));
}
// Reset selected index to -1 (no selection)
lbDeelnemer.SelectedIndex = -1;
#endregion
}
Here is my code from the non panorama page.
protected override void OnNavigatedTo(NavigationEventArgs e)
{
//second try
string strItemIndex;
if (NavigationContext.QueryString.TryGetValue("goto", out strItemIndex))
PanoramaControl.DefaultItem = MyPanorama.Items[Convert.ToInt32(strItemIndex)];
base.OnNavigatedTo(e);
//first try
string selectedIndex = "";
if (NavigationContext.QueryString.TryGetValue("selectedItem", out selectedIndex))
{
int index = int.Parse(selectedIndex);
DataContext = App.ViewModel.ItemsDeelnemer[index];
}
}
My problem, I want to navigate like you do with a default databound application. You click on the first listitem and you go to a new page (non panorama).
It looks simple but i can't find it.
Try binding the tag attribute to the index/itemvalue
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<HyperlinkButton Tag="{Binding FileName}" Click="location_Click"/>
<TextBlock Text="{Binding DateCreated}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
navigate accordingly
private void location_Click(object sender, RoutedEventArgs e)
{
HyperlinkButton clicked = (HyperlinkButton)sender;
string uri = "/noteapp;component/ViewEdit.xaml?id=" + clicked.Tag;
NavigationService.Navigate(new Uri(uri, UriKind.Relative));
}
and on panaroma page use this something like this to retrieve the value
filename = NavigationContext.QueryString["id"];
var storage = IsolatedStorageFile.GetUserStoreForApplication();
using (var file = storage.OpenFile(filename, FileMode.Open))