Forum Xamarin.Forms

Announcement:

The Xamarin Forums have officially moved to the new Microsoft Q&A experience. Microsoft Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

To create new threads and ask questions head over to Microsoft Q&A for .NET and get involved today.

Global styles not working with Visual Studio 2017

Richard_WRichard_W USMember ✭✭
edited July 2018 in Xamarin.Forms

I am using some global styles, declared in app.xaml in my PCL project. On Visual Studio 2015 they worked fine, but on upgrading to VS2017 they are now ignored. The styles were declared thus:

 <Application xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="ShoezApp.App">
  <Application.Resources>
    <ResourceDictionary>

        <Style TargetType="Label">
            <Setter Property="TextColor" Value="#333333" />
        </Style>

        <Style TargetType="Frame">
            <Setter Property="OutlineColor" Value="Black" />
        </Style>

        <Style TargetType="Button">
            <Setter Property="BorderColor" Value="Black" />
            <Setter Property="BorderWidth" Value="3" />
            <Setter Property="TextColor" Value="Black" />
            <Setter Property="HorizontalOptions" Value="Center" />
            <Setter Property="FontSize" Value="Medium" />
        </Style>
     </Application.Resources>
    </ResourceDictionary>
   </Application>

Is this a bug or do I need to do something differently to get global styles working with VS2017?

Tagged:

Answers

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    works fine for me in 2017. In fact I just wrote a tutorial using them - that I still need to post on my site. (see attached if it helps)

  • SzbestaSzbesta Member ✭✭✭

    Same here! Works without any issues in VS2017. Have you tried a blank project and tried to apply some global styles there. You could also try reloading the solution...

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    Do you by any chance have more than one style defined for the Button and neither has an x:key? Only one of them will be taken as the global default-most likely the last one in the XAML file since it is the last read.

  • Richard_WRichard_W USMember ✭✭

    @ClintStLaurent said:
    Do you by any chance have more than one style defined for the Button and neither has an x:key? Only one of them will be taken as the global default-most likely the last one in the XAML file since it is the last read.

    No other button styles defined without x:Key attribute. I can set the styles fine if I put them on each XAML page inside the ContentPage.Resources tag, but they just don't work globally with the Application.Resources tag.
    I have checked the following things:

    • All ResourceDictionary styles have an x:Key attribute
    • Application.Resources is defined once only, in App.XAML
    • Clean rebuild of the project
    • Same problem on different PC's after installing VS2017

    So I am stuck, I can set the styles in each XAML file but that seems a little redundant.

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    It all sounds right, and what I see looks right. Not sure what to tell ya.
    I'm not seeing that issue. The people I've shared that tutorial with say it helped "tons" so I guess that means it works for them too. @Szbesta said he's on 2017 and it works for him.

    I'd go with his quick test of a brand-new out of the box solution and test in that.

  • Richard_WRichard_W USMember ✭✭

    That's what I usually do when something just won't work (which seems to happen a lot with Xamarin) but at this late stage in app development, I'm minded to just put the styles in each XAML file and leave it at that.

  • JamesLaveryJamesLavery GBBeta, University ✭✭✭✭✭
    Do they not work on any platform, or only iOS?

    I've found that with xcode 9.4.1 styles on iOS don't work unless you use OnPlatform.
  • Richard_WRichard_W USMember ✭✭

    This is an Android project, but I tried OnPlatform however that didn't help.

  • Richard_WRichard_W USMember ✭✭
    edited July 2018

    So this is the only way I can get global styles to work:

    1) Add a content page, lets call it 'GlobalResourceDictionary'
    2) In the code-behind, remove the inheritance from ContentPage (so it just inherits from Object by default)
    3) Change GlobalResourceDictionary.xaml as well, so it also doesn't inherit from ContentPage, and add styles:

    <ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MyApp.GlobalResourceDictionary">
    <Style x:Key="buttonStyle" TargetType="Button">
        <Setter Property="BackgroundColor" Value="#ffffff" />
    </Style>
    

    4) In the ContentPage which needs the global styles, declare a local namespace:

         xmlns:local="clr-namespace:MyApp;assembly=MyApp"
    

    5) include the global resource dictionary in each ContentPage.Resources section, like this:

    <ContentPage.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <local:GlobalResourceDictionary />
             </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </ContentPage.Resources>
    

    Seems to do the trick.

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    Change GlobalResourceDictionary.xaml as well, so it also doesn't inherit from ContentPage

    Wait.. What? Stop.
    What do you mean your global dictionary was inheriting from ContenPage?
    Your code shows it being in the Application XAML where it belongs.

    If you're having to F'around with all your items not inheriting for where they are supposed to be... like pages don't come from pages - doesn't that raise a flag to you that something is very wrong and its going to get more wrong as you move forward?

  • Richard_WRichard_W USMember ✭✭
    edited July 2018

    No, my global dictionary was not inheriting from ContentPage, that was just how VS generated the XAML and code-behind files. I don't know how you can generate a XAML file which does not inherit from ContentPage. However, this is now working fine.

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    No, my global dictionary was not inheriting from ContentPage, that was just how VS generated the XAML and code-behind files.

    To be clear - Are your global styles in the APP class xaml? Not some file you made. But the Application class.

  • Richard_WRichard_W USMember ✭✭

    @ClintStLaurent said:
    To be clear - Are your global styles in the APP class xaml? Not some file you made. But the Application class.

    That was the problem, they were in the main application class (app.xaml) to start with, that worked on VS2015 and stopped working on VS2017. The odd thing was, removing the styles caused exceptions when the app tried to load styles with the missing keys, so they were loading, just not being displayed. And for the record, there was nothing wrong with the app coding anywhere, I spend a good few hours going through every XAML file looking for duplicated ResourceDictionary declarations, or multiple Application.Resources declarations, and so on.
    So now I have my styles in a separate file, GlobalResourceDictionary.xaml, and I am 'including' that in every XAML file in the ResourceDictionary.MergedDictionaries tag. My post may not be that clear about this. It was actually one of your other posts (can't remember offhand which one) which pointed me in this direction anyway, so many thanks for that.

Sign In or Register to comment.