Windows Phone: How to change time in TimePicker from C# code - windows-phone

I have defined 4 ToggleSwitch like this (copied from example). Do I have to use DataTemplate?? Now I would like to change time value in TimePicker. How do I access time_picker and change the content? Thanks a lot!
<toolkit:ToggleSwitch Name="sleep_mode" Grid.Row="1" Header="{Binding Path=LocalizedResources.Sleep_Mode, Source={StaticResource LocalizedStrings}}" Checked="fetch_sleepmode_Checked" Unchecked="fetch_sleepmode_UnChecked" Click="OnClicked">
<toolkit:ToggleSwitch.HeaderTemplate>
<DataTemplate>
<ContentControl FontSize="{StaticResource PhoneFontSizeLarge}" Foreground="{StaticResource PhoneForegroundBrush}" Content="{Binding}"/>
</DataTemplate>
</toolkit:ToggleSwitch.HeaderTemplate>
<toolkit:ToggleSwitch.ContentTemplate>
<DataTemplate>
<StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Path=LocalizedResources.Status, Source={StaticResource LocalizedStrings}}" FontSize="{StaticResource PhoneFontSizeSmall}"/>
<ContentControl HorizontalAlignment="Left" FontSize="{StaticResource PhoneFontSizeSmall}" Content="{Binding}"/>
</StackPanel>
<TextBlock Text="{Binding Path=LocalizedResources.SleepMode, Source={StaticResource LocalizedStrings}}" TextWrapping="Wrap" FontSize="{StaticResource PhoneFontSizeSmall}" Foreground="{StaticResource PhoneSubtleBrush}" Width="360"/>
**<toolkit:TimePicker x:Name="time_picker" ValueChanged="TimePicker_ValueChanged"/>**
</StackPanel>
</DataTemplate>
</toolkit:ToggleSwitch.ContentTemplate>
</toolkit:ToggleSwitch>

In your case, I don't see why you even bother setting ContentTemplate for the ToggleSwitch, since no custom binding is present (e.g. to an instance-specific collection).
Instead, set the content directly and modify the TimePicker properties the same way - through a named reference.
On a side note - why would you even want a TimePicker inside a ToggleSwitch?

Related

Styling ListView in UWP

I found this question + answer to my problem here on stackoverflow, but for me its not totally clear where to change the
ListViewItemPresenter
I tried many things, but it seems like I cant find it on my own :(
Here is my XAML code for this frame:
<Page.Resources>
<DataTemplate x:Key="ItemListDataTemplate" x:DataType="data:Item">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<Image Name="image" Source="{x:Bind CoverImage}" HorizontalAlignment="Center" Width="150" />
<StackPanel Margin="20,20,0,0">
<TextBlock Text="{x:Bind Name}" HorizontalAlignment="Left" FontSize="16" Name="NameTextBlock"/>
<TextBlock Text="{x:Bind Description}" HorizontalAlignment="Left" FontSize="10" Name="DescriptionTextBlock"/>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{x:Bind Price}" HorizontalAlignment="Left" FontSize="26" Name="PriceTextBlock"/>
<TextBlock Text="€" FontSize="26" Name="Currency" Margin="5,0,0,0"/>
</StackPanel>
</StackPanel>
</StackPanel>
</DataTemplate>
</Page.Resources>
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ListView ItemsSource="{x:Bind Items}"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
ItemClick="ListView_ItemClick"
IsItemClickEnabled="True"
ItemTemplate="{StaticResource ItemListDataTemplate}"
>
</ListView>
</Grid>
Can someone help me our please? Thank you very much for your time!
There are two ways to edit ListViewItemPresenter in your Page:
You can copy the XAML Template from here (the first XAML codes block below Default Style). Add it to your Page.Resources. ListViewItemPresenter lies among those XAML codes, you can edit its Properties and this style will be applied to all the items of this page's ListView. Notes: don't add x:Key to this style.
Add a ListViewItem Control to your Page like below:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ListViewItem></ListViewItem>
</Grid>
Document Outline->Select ListViewItem->Edit Template->Edit a Copy:
Remove the x:Key Property of generated Style Resource, so that this style will be applied to all ListViewItem. Then you can edit the ListViewItemPresenter in the generated XAML Resource.
Just add your DataTemplate inside of the Listview.
Put it in the ItemTemplate property.
<ListView ItemsSource="{x:Bind Items}"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
ItemClick="ListView_ItemClick"
IsItemClickEnabled="True" >
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Left">
<Image Name="image" Source="{x:Bind CoverImage}" HorizontalAlignment="Center" Width="150" />
<StackPanel Margin="20,20,0,0">
<TextBlock Text="{x:Bind Name}" HorizontalAlignment="Left" FontSize="16" Name="NameTextBlock"/>
<TextBlock Text="{x:Bind Description}" HorizontalAlignment="Left" FontSize="10" Name="DescriptionTextBlock"/>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{x:Bind Price}" HorizontalAlignment="Left" FontSize="26" Name="PriceTextBlock"/>
<TextBlock Text="€" FontSize="26" Name="Currency" Margin="5,0,0,0"/>
</StackPanel>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

GridView in WIndowsPhone

Hi Everyone, I want to create an GridView like this in windows phone 8.1
1.GridView is not supporting AutoGenerateColumns
This is the outpuit i got. Here i tried to obtain the data from Sqlite and binded to the ItemsSource property of gridview in gridview load event of the cs file.
My code:
<Grid Grid.Row="1" x:Name="ContentRoot" Margin="19,9.5,19,0">
<GridView x:Name="grdUser" HorizontalAlignment="Left" Height="auto" VerticalAlignment="Top" Width="auto" Loaded="grdUser_Loaded">
<GridView.HeaderTemplate><DataTemplate>
<Border Margin="5" BorderBrush="White" BorderThickness="1"><Grid ><Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/></Grid.ColumnDefinitions>
<TextBlock Text="UserName" />
<TextBlock Text="UserPassword" Grid.Column="1"/>
<TextBlock Text="CreatedDate" Grid.Column="2"/>
</Grid></Border> </DataTemplate></GridView.HeaderTemplate><GridView.ItemTemplate>
<DataTemplate>
<Border Margin="5" BorderBrush="White" BorderThickness="1"><Grid><Grid.ColumnDefinitions><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/><ColumnDefinition Width="Auto"/></Grid.ColumnDefinitions>
<TextBlock x:Name="tbUserName" Text="{Binding UserName}"/>
<TextBlock x:Name="tbUserPassword" Text="{Binding UserPassword}" Grid.Column="1"/>
<TextBlock x:Name="tbCreatedDate" Text="{Binding CreationDate}" Grid.Column="2"/>
</Grid></Border></DataTemplate></GridView.ItemTemplate></GridView> </Grid>
Is there any other controls for kind of requirements.
Take a look at the MyToolkit library, it has a datagrid control that could be ok for you.
https://github.com/MyToolkit/MyToolkit/wiki/DataGrid

Getting values from a keyvaluepair in xaml

I have a GridView that's bound to a Dictionary:
<GridView x:Uid="SearchInputRecentSearches"
x:Name="SearchInputRecentSearches"
ItemsSource="{Binding RecentSearches}"
Grid.Row="1"
Grid.Column="1"
Style="{StaticResource RecentSearchGrid}">
Inside of this GridView, in the ItemTemplate, I want to show the Key or Value:
<GridView.ItemTemplate>
<DataTemplate>
<StackPanel Style="{StaticResource RecentSearchesItemStackPanel}">
<TextBlock Text="{Binding Key}"/>
<Button Width="31"
Height="31"
Command="{Binding DataContext.ExecuteDeleteSearch, ElementName=SearchInputRecentSearches}"
CommandParameter="{Binding Key}"
Template="{StaticResource DeleteButton}"/>
<TextBlock Style="{StaticResource RecentSearchStyle}"
Text="{Binding Value}" />
</StackPanel>
</DataTemplate>
</GridView.ItemTemplate>
However, nothing displays for either Key or Value when I run this. I've tried referring to Path=Key and Path=Value inside of the binding, but this doesn't work, either. I'm currently using a ValueConverter to get the key or value out, but this seems a little unnecessary and I was hoping someone could point out what I was doing wrong!

WP8 TextBlock Height

I have a handful of TextBlock's on my MainPage.xaml which have a subtle amount of distance between each other to look uniform. The last textbox however is larger and allows the text to be wrapped. The problem which I am facing is when I populate the textbox with a lot of content and all of the textblock's seem to stick to one another.
Image to explain:
The left image is fine, but as you can see on the right image, when I fill the box completely then all the textblock's magically stick together somehow.
Markup:
<ScrollViewer x:Name="LayoutRoot" Background="Transparent">
<Grid>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel Grid.Row="0" Margin="12,17,0,635">
<TextBlock Text="Project" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock Text="Project" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<Grid x:Name="ContentPanel" Margin="12,161,12,0">
<toolkit:ListPicker x:Name="myObj" ItemsSource="{Binding myobj, ElementName=this, Mode=OneTime}" Margin="12,12,12,537" >
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name, Mode=OneTime}" FontSize="{StaticResource PhoneFontSizeSmall}"/>
<TextBlock Text="{Binding Id, Mode=OneTime}" FontSize="{StaticResource PhoneFontSizeSmall}" Visibility="Collapsed"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name, Mode=OneTime}" Padding="5" FontSize="{StaticResource PhoneFontSizeLarge}"/>
<TextBlock Text="{Binding Id, Mode=OneTime}" FontSize="{StaticResource PhoneFontSizeSmall}" Visibility="Collapsed"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
<toolkit:PhoneTextBox Height="auto" Name="txtName" Margin="0,70,0,456" Hint="Name" Text="{Binding Name, Mode=TwoWay}" LostFocus="TxtName_OnLostFocus"/>
<toolkit:PhoneTextBox Height="auto" Name="txtAddress" Margin="0,138,0,388" Hint="First Line of Address" Text="{Binding Address, Mode=TwoWay}" LostFocus="TxtAddress_OnLostFocus"/>
<toolkit:PhoneTextBox Height="auto" Name="txtEmail" Margin="0,206,0,320" Hint="Email Address" Text="{Binding Email, Mode=TwoWay}" LostFocus="TxtEmail_OnLostFocus"/>
<toolkit:PhoneTextBox Height="auto" Name="txtTelephone" Margin="0,274,0,252" Hint="Telephone" Text="{Binding Telephone, Mode=TwoWay}" LostFocus="TxtTelephone_OnLostFocus"/>
<toolkit:PhoneTextBox Height="auto" Name="txtComments" Margin="0,340,0,71" Hint="Comments" TextWrapping="Wrap"/>
</Grid>
</Grid>
</ScrollViewer>
Anyone see the obvious problem?
I think problem is with your margin. And the XAML is not efficient also.
Why dont you just add Rows to your Grid and place each TextBox into its own row - that will help you not to HARDCODE margins which lead to messing up the result...
Or the other way is to place everuthing into a Vertical Stack Panel
I fixed the issue by replacing Height="auto" to Height="80" on the TextBlocks.

Binding Listbox item source to a collection of collections in windows phone 7

I am trying to bind a Listbox ItemSource to a collection of multiple Lists. i.e.
List PersonCollection
List Person
List Collection
Now I need to show items from both of these list. In wpf you could use HierarchicalDataTemplate i believe, but not sure how I can do it in windows phone 7. Tried with Blend and it generates the following data template.
<DataTemplate x:Key="PersonDataTemplate">
<Grid>
<StackPanel Margin="0,0,1,0" Orientation="Vertical" VerticalAlignment="Top">
<TextBlock Margin="0,0,1,0" TextWrapping="Wrap" Text="{Binding Person[0].Name}" d:LayoutOverrides="Width"/>
<TextBlock Margin="0,0,1,0" TextWrapping="Wrap" Text="{Binding Collection[0].Total}" d:LayoutOverrides="Width"/>
</StackPanel>
</Grid>
</DataTemplate>
<ListBox Height="300" x:Name="personList" ItemsSource="{Binding PersonCollection}" Margin="10,0" ItemTemplate="{StaticResource PersonDataTemplate}"/>
Is there another way I can do this? I have tried to set the DataContext of Textbox in DataTemplate to individual arrays but did not seem to work. Cant find anything similar on the net apart from the confirmation that HierarchicalDataTemplate is not supported in Windows Phone 7.
I have other ways to do but none elegant..
Thanks in advance.
Regards
I think your scenario can be solved with two level ListBoxes instead of Tree-Heirarchy. See if the below trick works. Now you will see Both of your inner collection side by side in a Grid which are two other ItemsControls(Or you can have ListBoxes)
<DataTemplate x:Key="PersonCollextionItem">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.5*"/>
<ColumnDefinition Width="0.5*"/>
</Grid.ColumnDefinitions>
<ItemsControl ItemsSource="{Binding ListPerson}" ItemTemplate="{StaticResource Templ1}" Grid.Column="0"/>
<ItemsControl ItemsSource="{Binding ListCollection}" ItemTemplate="{StaticResource Templ2}" Grid.Column="1"/>
</Grid>
</DataTemplate>
<DataTemplate x:Key="Templ1">
<TextBlock Margin="0,0,1,0" Text="{Binding Name}" />
</DataTemplate>
<DataTemplate x:Key="Templ2">
<TextBlock Margin="0,0,1,0" Text="{Binding Total}" />
</DataTemplate>
<ListBox Height="300" x:Name="personList" ItemsSource="{Binding PersonCollection}" Margin="10,0" ItemTemplate="{StaticResource PersonCollextionItem}"/>