how to put stackpanel style property in style and setter - windows-phone-7

how can put the below style property into style , setter
<StackPanel >
<StackPanel.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF707070"/>
</LinearGradientBrush>
</StackPanel.Background>
</StackPanel>
it thing it may like
<Style TargetType="StackPanel" x:Key="Psp">
<Setter Property="Background" Value="Black" ></Setter>
<Setter Property="Background">
<Setter.Value >
<StackPanel >
<StackPanel.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF707070"/>
</LinearGradientBrush>
</StackPanel.Background>
</StackPanel>
</Setter.Value>
</Setter>
</Style>
it giving error on <Setter.Value >
Specified value cannot be assigned, the following type is expected
"Brush"
<StackPanel Grid.Row="1" Style="{StaticResource Psp}">
<TextBlock Text="This is a test"></TextBlock>
</StackPanel>

In your app.xaml
<Application.Resources>
<Style TargetType="StackPanel" x:Key="Psp">
<Setter Property="Background" Value="Black" ></Setter>
<Setter Property="Background">
<Setter.Value >
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF707070"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Style>
</Application.Resources>
In your page
<StackPanel Grid.Row="1" Style="{StaticResource Psp}">
<TextBlock Text="This is a test"></TextBlock>
</StackPanel>
You can obviously define the style on the page level or control level too.

Thanks every i have solve this problem
<Style TargetType="StackPanel" x:Key="Psp">
<Setter Property="Margin" Value="5,5,3,5" />
<Setter Property="Height" Value="40"/>
<Setter Property="Background" Value="{StaticResource Brushh}" ></Setter>
</Style>
<LinearGradientBrush x:Key="Brushh" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Black" Offset="0"/>
<GradientStop Color="#FF707070"/>
</LinearGradientBrush>

Related

How can I set LinearGradientBrush as the background for of ContentPages?

How can I add LinearGradientBrush as ContentPage.Background in App.xaml's ResourceDictionary? My code pasted below:
<LinearGradientBrush EndPoint="0,1">
<GradientStop Color="LightBlue"
Offset="0.1" />
<GradientStop Color="DarkBlue"
Offset="1.0" />
</LinearGradientBrush>
As LinearGradientBrush is a preview concept,don't forgget to add below codes in your App.xaml.cs.
Device.SetFlags(new string[] {"Brush_Experimental" });
and add below to the App.xaml:
<Application.Resources>
<ResourceDictionary>
<Style TargetType="ContentPage" ApplyToDerivedTypes="True">
<Setter Property="Background">
<LinearGradientBrush EndPoint="0,1">
<GradientStop Color="LightBlue"
Offset="0.1" />
<GradientStop Color="DarkBlue"
Offset="1.0" />
</LinearGradientBrush>
</Setter>
</Style>
</ResourceDictionary>
</Application.Resources>

Change windowStyle of Prism Dialogwindow

How can I change the window style dynamically via Trigger?
Like:
<Style TargetType="UserControl">
<Setter Property="prism:Dialog.WindowStyle" Value="{DynamicResource DefaultDialogStyleTheme}"></Setter>
<Style.Triggers>
<DataTrigger
Binding="{Binding SecondOne, UpdateSourceTrigger=PropertyChanged}"
Value="true">
<Setter Property="prism:Dialog.WindowStyle" Value="{DynamicResource DialogStyleTheme}"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>`
You can register your own IDialogWindow implementation that has all the styles you desire.
The library's implementation's code's here (xaml) and there (code-behind) as a reference.
Thanks for your help :), But for example before we switched to new Prism, we've used a PopupWindowAction to raise a default window or a custom window:
var wrapperWindow = GetWindow(args.Context);
wrapperWindow.ShowDialog();
GetWindow returns a Window or CustomWindowObject.
That's the custom window style:
<Style x:Key="DialogStyleTheme" TargetType="implementation:CustomDialogWindow">
<Setter Property="WindowStyle" Value="None" />
<Setter Property="ResizeMode" Value="CanMinimize" />
<Setter Property="SizeToContent" Value="WidthAndHeight" />
<Setter Property="Background" Value="Transparent" />
<Setter Property="AllowsTransparency" Value="True" />
<Setter Property="FontSize" Value="60" />
<Setter Property="ShowInTaskbar" Value="False" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="implementation:CustomDialogWindow">
<Border BorderThickness="2" CornerRadius="10" BorderBrush="White" Background="DimGray"
x:Name="MainBorder">
<Grid Background="{TemplateBinding Background}" Margin="5,5,5,5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="30" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid Grid.Row="0" x:Name="MoveGrid">
<Image x:Name="Image">
<Image.Style>
<Style TargetType="Image">
<Setter Property="Stretch" Value="UniformToFill" />
<Style.Triggers>
<DataTrigger Binding="{Binding SmallTitle}" Value="true">
<Setter Property="Height" Value="40" />
</DataTrigger>
</Style.Triggers>
</Style>
</Image.Style>
</Image>
<TextBlock Text="{Binding Title}">
<TextBlock.Style>
<Style BasedOn="{StaticResource TouchHeadTextBlock}" TargetType="TextBlock">
<Style.Triggers>
<DataTrigger Binding="{Binding SmallTitle}" Value="true">
<Setter Property="FontSize" Value="25" />
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
</Grid>
<ContentPresenter Grid.Row="2" x:Name="ContentPresenter" ClipToBounds="True" />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
And I'm setting the WindowStyle in my UserControl and I want to change this style via trigger....
prism:Dialog.WindowStyle="{DynamicResource DialogStyleTheme}"
Initialization:
containerRegistry.RegisterDialog<ItemSelectionDialogView, ItemSelectionDialogViewModel>();
containerRegistry.RegisterDialogWindow<CustomDialogWindow>();

How to format Time in TimePickerControl in Windows Phone 8.1?

I have a time picker control in xaml as
<TimePicker Time="{Binding SelectedTime, Mode=TwoWay}" HorizontalContentAlignment="Center"
Style="{StaticResource TimePickerStyle}" x:Name="SeekTimePicker" />
and of the control is
<Style x:Key="TimePickerStyle" TargetType="TimePicker">
<Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" />
<Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}" />
<Setter Property="Foreground" Value="{ThemeResource TimePickerForegroundThemeBrush}" />
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TimePicker" >
<StackPanel x:Name="LayoutRoot" Margin="{TemplateBinding Padding}" Background="Red">
<ContentPresenter x:Name="HeaderContentPresenter"
ContentTemplate="{TemplateBinding HeaderTemplate}"
Content="aaaa" Margin="0,0,0,-3"
Style="{StaticResource HeaderContentPresenterStyle}" />
<Button x:Name="FlyoutButton" BorderBrush="{TemplateBinding Foreground}" BorderThickness="1"
Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Stretch"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
IsEnabled="{TemplateBinding IsEnabled}" Padding="6.5,0,0,3" Content="qqqqqqqqqqqq" Background="Green"/>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Now it look like:
But I want to format it as:
This can do by editing template inside time picker style as below
<Style x:Key="TimePickerStyle" TargetType="TimePicker">
<Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" />
<Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}" />
<Setter Property="Foreground" Value="{ThemeResource TimePickerForegroundThemeBrush}" />
<Setter Property="HorizontalAlignment" Value="Stretch" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="TimePicker">
<StackPanel x:Name="LayoutRoot" Margin="{TemplateBinding Padding}">
<ContentPresenter x:Name="HeaderContentPresenter"
ContentTemplate="{TemplateBinding HeaderTemplate}"
Content="{TemplateBinding Header}" Margin="0,0,0,-3"
Style="{StaticResource HeaderContentPresenterStyle}" />
<Button x:Name="FlyoutButton" BorderBrush="{TemplateBinding Foreground}" BorderThickness="1"
Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Stretch"
HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
IsEnabled="{TemplateBinding IsEnabled}" Padding="6.5,0,0,3" >
<Button.ContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding ElementName=FlyoutButton,Path=DataContext.SelectedTimeText}"/>
</DataTemplate>
</Button.ContentTemplate>
</Button>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

How to style a button through code

I'm trying to give a style I made in blend to a button that generates in the code. I tried the following but it doesn't seem to work. I also can't find any solutions online.
Here is the code.
private void createBtn()
{
Button btn = new Button();
btn.Name = buttonName;
btn.Style = popUpStyle;
btn.Margin = new Thickness(20);
btn.Content = "Close";
btn.Click += new RoutedEventHandler(btn_Click);
btn.Visibility = System.Windows.Visibility.Visible;
Canvas.Children.Add(btn);
}
And the xaml.
<Style x:Name="popUpStyle" TargetType="Button">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/>
<Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/>
<Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/>
<Setter Property="Padding" Value="10,3,10,5"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate x:Name="popUpStyleCT" TargetType="Button">
<Grid Background="Transparent" Height="150" Width="200">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal"/>
<VisualState x:Name="MouseOver"/>
<VisualState x:Name="Pressed"/>
<VisualState x:Name="Disabled"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Rectangle Fill="#FFC2C2C2" Margin="0,15,0,0"/>
<Rectangle Fill="#FF313197" Height="15" Stroke="Black" VerticalAlignment="Top" Opacity="0.25"/>
<Rectangle Fill="#FFE20303" HorizontalAlignment="Right" Height="15" Stroke="Black" VerticalAlignment="Top" Width="30" Opacity="0.25"/>
<TextBlock HorizontalAlignment="Right" Height="15" TextWrapping="Wrap" Text="X" VerticalAlignment="Top" Width="14" FontSize="13.333" Margin="0,0,5,0"/>
<Rectangle Fill="#FF4D4A4A" Height="22" Margin="50,0,44,8" VerticalAlignment="Bottom" Stroke="Black"/>
<Border x:Name="ButtonBackground" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="0" Margin="0,12,0,34">
<ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Margin="-3,2,73,0" Foreground="Black" FontSize="13.333" VerticalAlignment="Top" HorizontalAlignment="Left"/>
</Border>
<TextBlock Height="15" TextWrapping="Wrap" Text="Close" VerticalAlignment="Bottom" FontSize="13.333" Margin="85,0,81,12" Foreground="Black"/>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I think this answer on SL forum is what you've been searching for.

adding a header to a listbox's scrollviewer and keeping the virtualizingStackPanel (wp7)

I want to add a header to my ListBoxes and I do this by using a template.
The problem is that if I extend the ListBox's template it seems that the listbox's virtualizingstackpanel doesn't work anymore as expected: it loads all content before I can scroll it.
I found some relevant questions in stackoverflow like this (VirtualizingStackPanel stops working when overriding the default control template for ScrollViewer) but the solution given there cannot be applied to WP7: I can't find the property named "CanContentScroll" of the scrollviewer.
my code
<Style x:Key="ListBoxStyle1" TargetType="ListBox">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBox">
<ScrollViewer x:Name="ScrollViewer"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}"
Foreground="{TemplateBinding Foreground}"
Padding="{TemplateBinding Padding}">
<StackPanel>
<TextBlock Text="..."/>
<ItemsPresenter/>
</StackPanel>
</ScrollViewer>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
To be honest, I'm really not sure what the actual problem is here; the VirtualizingStackPanel is still in the visual tree, but it seems that none of the items actually added. Enough of the bad news, the good news is I've found a way to work round it, by changing the default style of the ScrollViewer to place the header there instead, which results in two styles that look like this:
<Style x:Key="ScrollViewerStyle1" TargetType="ScrollViewer">
<Setter Property="VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ScrollViewer">
<Border BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Background="{TemplateBinding Background}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="ScrollStates">
<VisualStateGroup.Transitions>
<VisualTransition GeneratedDuration="00:00:00.5" />
</VisualStateGroup.Transitions>
<VisualState x:Name="Scrolling">
<Storyboard>
<DoubleAnimation Storyboard.TargetName="VerticalScrollBar"
Storyboard.TargetProperty="Opacity"
To="1"
Duration="0" />
<DoubleAnimation Storyboard.TargetName="HorizontalScrollBar"
Storyboard.TargetProperty="Opacity"
To="1"
Duration="0" />
</Storyboard>
</VisualState>
<VisualState x:Name="NotScrolling">
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid Margin="{TemplateBinding Padding}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock Text="Header" Style="{StaticResource PhoneTextLargeStyle}"/>
<ScrollContentPresenter x:Name="ScrollContentPresenter"
Grid.Row="1"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}" />
<ScrollBar x:Name="VerticalScrollBar"
Grid.RowSpan="2"
IsHitTestVisible="False"
Opacity="0"
Height="Auto"
Width="5"
HorizontalAlignment="Right"
VerticalAlignment="Stretch"
Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}"
IsTabStop="False"
Maximum="{TemplateBinding ScrollableHeight}"
Minimum="0"
Value="{TemplateBinding VerticalOffset}"
Orientation="Vertical"
ViewportSize="{TemplateBinding ViewportHeight}" />
<ScrollBar x:Name="HorizontalScrollBar"
Grid.RowSpan="2"
IsHitTestVisible="False"
Opacity="0"
Width="Auto"
Height="5"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom"
Visibility="{TemplateBinding ComputedHorizontalScrollBarVisibility}"
IsTabStop="False"
Maximum="{TemplateBinding ScrollableWidth}"
Minimum="0"
Value="{TemplateBinding HorizontalOffset}"
Orientation="Horizontal"
ViewportSize="{TemplateBinding ViewportWidth}" />
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="ListBoxStyle2" TargetType="ListBox">
<Setter Property="Background" Value="Transparent"/>
<Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="BorderThickness" Value="0"/>
<Setter Property="BorderBrush" Value="Transparent"/>
<Setter Property="Padding" Value="0"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBox">
<ScrollViewer x:Name="ScrollViewer"
Grid.Row="1"
Style="{StaticResource ScrollViewerStyle1}"
Foreground="{TemplateBinding Foreground}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Padding="{TemplateBinding Padding}">
<ItemsPresenter />
</ScrollViewer>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Resources