I am trying to change the background, pressed state background and color of selected date, time values in ComboBox (that is currently Accent color). The problem is that when I apply the default template available at msdn here and here.
My control changes such that each value in these boxes now have different ComboBox instead of just one. Like in the following image (day, month, year have different ComboBox).
(Image is only for reference)
Also some of the theme resources are missing too like
Foreground="{ThemeResource TimePickerHeaderForegroundThemeBrush}"
Margin="{ThemeResource TimePickerHeaderThemeMargin}"
FontWeight="{ThemeResource TimePickerHeaderThemeFontWeight
This is how my control look like at the moment without styling applied
Here is the code I am using
<DatePicker x:Name="Date_Picker"
Header="Date:"
Background="{StaticResource HotPink}"
Foreground="{StaticResource Gray05}" />
<TimePicker x:Name="Time_Picker"
Header="Time:"
MinuteIncrement="5"
Background="{StaticResource HotPink}"
Foreground="{StaticResource Gray05}"/>
One more issue is that pink background is only visible on DatePicker and not on TimePicker which is very weird.
You should edit the templates of the controls. Open the project in Blend and find the element in the Document Outline. Right-click and select Edit Template > Edit a Copy... (see picture below). This will generate a copy of the default template. From this you can edit the different visual states (which determine how the control will look in different states: active/hover/disabled/etc). When you set the custom values here, they should work as expected.
Screenshot from Blend for VS2015
Related
In a Windows 10 UWP application, can VisualState Setter have a Target value equal to a XAML control type? For example can you do this to target all the TextBlock font size on the page (kind of like that way CSS works to apply styles on HTML tags)
<VisualState.Setters>
<Setter Target="TextBlock.FontSize" Value="{StaticResource SmallScreenFontSize}"/>
</VisualState.Setters>
If not, is there a better way to accomplish setting the property to groups of the same controls instead of assigning each control on the page a unique name - which is tedious if there are many on the page.
Should I make a user control for the text block and apply visual state to the user control instead?
I do not know any option to do that - few months ago I had the same question but unfortunately for now there is no such option to set target XAML control for the Setter.
As BoltClock mentioned one of the best way is to save Control Template as a new Style and then insert Visual States in this template.
You can find how create Control Template below:
https://msdn.microsoft.com/en-us/library/cc189093(VS.95).aspx
Using above example you can just define specific control with desired behaviour but with custom style.
I am using Xamarin.Forms, with my view created fully in XAML. I am also using Xamarin.Forms.Labs.
I have bound an EntryCell to a property like so:
<EntryCell Label="Name:" Text="{Binding Name, Mode=TwoWay}" />
The page has a 'Save' ToolBarItem which saves the property to a database.
The issue I have is that the Name property is only updated when the entry cell loses focus after the user changes the text. Clicking the ToolBarItem does not change focus and therefore the property is not updated before being saved.
I would like the property to be updated with every key press from the user. I know of 'UpdateSourceTrigger' for Silverlight, but I can't find an equivalent way to do this in Xamarin Forms?
There is no equivalent for UpdateSourceTrigger in Xamarin.Forms
There doesn't seem to be a xamarin equivalent to UpdateSourceTrigger. I have had success by removing the SetProperty call from the bound property so that the property changed does not fire, and then using EntryUnfocused to trigger an explicit PropertyChanged event.
I have the following set up for my TextBlock
<TextBox x:Name="SearchTextBlock" InputScope="Search" Opacity="0.999"
Height="Auto" VerticalAlignment="Top"
BorderBrush="{StaticResource ThemeBrush}" BorderThickness="8" />
which yields
But extra space remains around the TextBlock. How might I remove this? Do I need to create a style or can this be done within the TextBlock tag itself?
From the Designer right click on the TextBox and select Edit Template -> Edit a Copy
Choose where do you want to save it and choose it's Key
And then analyzing the code generated you see Margin="{StaticResource PhoneTouchTargetOverhang}"
witch you can play with until you like the result.
TextBox has a theme style applied to it. Things like margin and padding should be fairly consistent between themes. The best way I've found to "override" the style of something (including a TextBox) is the copy the style resource and tweak it. This is easily done with the Document Outline window.
First, make sure the Document Outline window is visible. This can be done with Ctrl+W,U if you use the Visual C# keyboard thread. Or, View\Other Windows\Document Outline.
Next, make sure the control you want to copy the resource from is selected in the Design surface. Then, go to the document outline and you will see the control selected in there. Right-click the control and select Edit Template/Edit a Copy.... This will create a copy of the style resource (defaulting to within you page XAML. but you have the option of other destinations.). You can then edit that private resource to your heart's content.
In terms of the amount of space around the TextBox, look for things like "MainBorder" in that style.
Update:
verdesrobert's method of getting a copy of the style is much quicker than mine :). Learn something new every day!
In my application i am using MultiselectList for selecting a list of student information. Here my issue is that, I am using a black background image for my page,
Because of this in white theme, the checkbox portion is invisible. I try to edit the template of checkbox item in Blend, but failed, while editing the template its populating a huge chunk of code in XAML.
While editing template instead of style its generating Template (I edited the Multilist Item using Blend).
In the real application i am using itemtemplate and assign the resource to this item template.
So I don't know where to assign this template, and where to edit in that template to change my checkbox colour, this is a blocker issue for me, my friend told me that without theme support the app won’t pass market place submission.
Doing what you want to do, ie. editing the color of the checkbox, depending on the theme and background selected would be too much work. Have you tried using the default styles that come with Silverlight? For example, In this case, PhoneContrastbackgroundColor would be a good choice.
XAML code
<DataTemplate x:Key="whatever">
<TextBlock Text="ItemName"/>
<CheckBox BackgroundColor="{StaticResource PhoneContrastbackgroundColor}"/>
</DataTemplate>
My XAML file contains a RadioButton. In the Visual Studio's XAML Designer I can see the display of the Content string for this RadioButton. However, when I run the application, the RadioButton is displayed in the GUI without the Content string "Disble E-mail Alerts from Dashboard". Following is the line in the XAML file which declares the RadioButton:
<RadioButton Height="16" Margin="30,50,0,0" VerticalAlignment="Top" Name="DashboardDisableAlerts" HorizontalAlignment="Left" Width="194">Disble E-mail Alerts from Dashboard</RadioButton>
I will really appreciate any help in helping debug why the Content string is not being displayed in the GUI at runtime.
Thanks
Use a tool like Snoop to examine your visual tree. I suspect the text is there but its foreground color makes it invisible.