Close modal

Blog Post

Override Windows Phone cell selection with Xamarin Forms

Development
Fri 09 September 2016
0 Comments


This will be a short nugget of a guide. If you've used Xamarin Forms, you'll know how easy it is to get going, and you might start out with an iOS and Android project. Now fast-forward to trying to get this on Windows Phone, you might find the below gotcha.

When using a Listview and selecting an item on iOS or Android you'll find you can set the text colours of any labels. On windows phone you might notice that any labels in the selected cell turn to blue or another pre-defined system colour. This is of a particular problem if you're customising the cell's background colour on selection (especially if that's a blue background that clashes with Windows Phone accent). Let's override this behaviour which takes a little digging through the ListViewRenderer code on WP8 to work out.

Let's assume we have a theme event for our PCL/X-Forms app
using System;   
using Xamarin.Forms;

//We have a basic theme with some definitions
public interface IAppStyle
{
    Color MainBackground {get;}
    Color MainText {get;}
    Color SelectedText => MainText;
    Color SelectedBackground => MainBackground;
}

//Our app knows about a theme/style
public class App : Application {
    public IAppStyle PreferredTheme
    public event EventHandler ThemeChanged = delegate {};
}
Handling these changes from within the native WP app

We can handle this within the MainPage of our Windows Phone app by subscribing to the theme changing event, and updating the relevant native properties.

using System;
using System.Windows.Controls;
using System.Windows.Navigation;
using Microsoft.Phone.Controls;
using Microsoft.Phone.Shell;
using WApp = Windows.UI.Xaml.Application;

namespace MyApp.WinPhone
{

    void HandleThemeChanged(object sender, EventArgs a)
    {
        var cc = new Xamarin.Forms.Platform.WinRT.ColorConverter();
        var color = App.Current.PreferredTheme.SelectedBackground;
        var key = "SystemColorControlAccentBrush";
        WApp.Current.Resources[key] = (SolidColorBrush)cc.Convert(color, null, null, null);
    }

    public partial class MainPage : 
        global::Xamarin.Forms.Platform.WinPhone.FormsApplicationPage
    {
        public MainPage()
        {
            InitializeComponent();

            global::Xamarin.Forms.Forms.Init();
            var app = new MyApp.App();
            LoadApplication(app);
        }
    }
}

And there you go, the key takeaaway is setting the SystemColorControlAccentBrush property, which must of course be set from the native project. You can extend this to support other properties you need or even use it once at startup without event delgates if your application's styling is static.