Question

I am trying to create bottom bar. In this bottom bar there are 4 buttons. Now I have create the bottom bar and I have included in all the pages. It's working..!! Now I want to remove the padding and blink of the buttons. So that I have try like this.

<UserControl x:Class="NewExample.BottomTabBar"  
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
 d:DesignHeight="100" d:DesignWidth="480"             
shell:SystemTray.IsVisible="True">

<phone:PhoneApplicationPage.Resources>
    <Style x:Key="ButtonStyle1" 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 TargetType="Button">
                    <Grid Background="Transparent">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal"/>
                                <VisualState x:Name="MouseOver"/>
                                <VisualState x:Name="Pressed"/>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}">
                            <ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        </Border>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</phone:PhoneApplicationPage.Resources>

<Grid x:Name="BottomToolUIContainer" Height="100" Width="480">

    <Button Command="{Binding Button1}" Background="{Binding BackColor1}" Content="Test 1" Height="120" HorizontalAlignment="Left" Name="MyBeno" VerticalAlignment="Top" Width="140" Margin="-10,-10,0,0" />

    <Button Command="{Binding Button2}" Background="{Binding BackColor2}"  Content="Test 2" Height="120" HorizontalAlignment="Left" Margin="109,-10,0,0" Name="Search" VerticalAlignment="Top" Width="140" />

    <Button Command="{Binding Button3}" Background="{Binding BackColor3}"   Content="Test 3" Height="120" HorizontalAlignment="Left" Margin="228,-10,0,0" Name="MyBasket" VerticalAlignment="Top" Width="140" />

    <Button Command="{Binding Button4}" Background="{Binding BackColor4}"  Content="Test 4" Height="120" HorizontalAlignment="Left" Margin="347,-10,0,0" Name="MyInfo" VerticalAlignment="Top" Width="140" />


</Grid>

But I am getting error that is:-The attachable property 'Resources' was not found in type 'PhoneApplicationPage'

Please let me know how to resolve this problem. Thanks in advance.

Was it helpful?

Solution

Since you have a UserControl, you should add the style within <UserControl.Resources> instead of <phone:PhoneApplicationPage.Resources> :

<UserControl.Resources>
    <Style x:Key="ButtonStyle1" TargetType="Button">
        ........
        ........
    </Style>
</UserControl.Resources>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top