locked
How to edit Style and Template of page?

    Question

  • I have created custom page inherited from Page Class in WinRT.i have applied style and control template to this,but it was not getting applied ,i am always getting the default Page style and template.

    Please find the Style and Template:

      <Style TargetType="local:CustomPage">
                    <Setter Property="FontSize" Value="60"/>
                    <Setter Property="Foreground" Value="Yellow"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="local:CustomPage">
                               <ContentPresenter/>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
     </Style>




    Tuesday, June 03, 2014 11:08 AM

Answers

  • You need to define a Page base class that doesn't have any XAML associated with it and then use this one as the base class for the instance that you are trying to style:

    public abstract class MyCustomPage : Page { }

    CustomPage.xaml.cs:

     public partial class CustomPage : MyCustomPage
     {
      public CustomPage()
      {
       InitializeComponent();
      }
     }


    CustomPage.xaml:

    <local:MyCustomPage ...
       xmlns:local="...">
    
        ...
    </local:MyCustomPage>
    


    App.xaml:

      <Style TargetType="local:MyCustomPage">
       <Setter Property="FontSize" Value="60"/>
       <Setter Property="Foreground" Value="Yellow"/>
       <Setter Property="Template">
        <Setter.Value>
         <ControlTemplate TargetType="local:MyCustomPage">
          <ContentPresenter/>
         </ControlTemplate>
        </Setter.Value>
       </Setter>
      </Style>


    Tuesday, June 03, 2014 1:39 PM

All replies

  • Hi Ravuthasamy ,

    If you need to set the FontSize and Foreground properties, why not to apply them directly to the page:

    <Page
        x:Class="QuickTest.MainPage"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:QuickTest"
        FontSize="60" Foreground="Yellow">
    
        <Grid Background="White">
            <Grid Background="DarkGray" Width="500" Height="300">
                <TextBlock>
                Lorem ipsum dolor sit amet...
                </TextBlock>
            </Grid>
        </Grid>
    </Page>
    

    You can treat the page XAML as one big template for the page.


    Wiki: wbswiki.com
    Website: www.wisenheimerbrainstorm.com

    Tuesday, June 03, 2014 1:26 PM
  • You need to define a Page base class that doesn't have any XAML associated with it and then use this one as the base class for the instance that you are trying to style:

    public abstract class MyCustomPage : Page { }

    CustomPage.xaml.cs:

     public partial class CustomPage : MyCustomPage
     {
      public CustomPage()
      {
       InitializeComponent();
      }
     }


    CustomPage.xaml:

    <local:MyCustomPage ...
       xmlns:local="...">
    
        ...
    </local:MyCustomPage>
    


    App.xaml:

      <Style TargetType="local:MyCustomPage">
       <Setter Property="FontSize" Value="60"/>
       <Setter Property="Foreground" Value="Yellow"/>
       <Setter Property="Template">
        <Setter.Value>
         <ControlTemplate TargetType="local:MyCustomPage">
          <ContentPresenter/>
         </ControlTemplate>
        </Setter.Value>
       </Setter>
      </Style>


    Tuesday, June 03, 2014 1:39 PM
  • Hi,

    You can refer to the links below to know how to create a custom control and edit lts style:

    http://timheuer.com/blog/archive/2012/03/07/creating-custom-controls-for-metro-style-apps.aspx

    http://blogs.msdn.com/b/windowsappdev/archive/2012/10/15/building-a-custom-control-using-xaml-and-c.aspx

    Best Wishes!


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey. Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Wednesday, June 04, 2014 6:28 AM
  • Hi Magnus,

    This solution is not solve the problem,but it turn me to in right direction.thanks for the answer.

    Regards,

    Ravuthasamy D


    Wednesday, June 04, 2014 1:12 PM