Question

I’m trying to make separate views for Tablet and Mobile. In app_start i have this code

DisplayModeProvider.Instance.Modes.Insert(0, new
        DefaultDisplayMode("Tablet")
        {
            ContextCondition = (ctx =>
            ctx.Request.UserAgent.IndexOf("iPad", StringComparison.OrdinalIgnoreCase) >= 0 ||
            ctx.Request.UserAgent.IndexOf("Android", StringComparison.OrdinalIgnoreCase) >= 0)
        });

I’ve created two layout files, one for mobile and one for Tablet. But there is conflict when i’m accessing from mobile device which is on Android. It redirects me to layout.tablet. How could i separate those two devices?

Answer 1

I’ve tested this with user-agent switcher in browser and it works fine.

DisplayModeProvider.Instance.Modes.Insert(0, new
        DefaultDisplayMode("Tablet")
        {
            ContextCondition = (ctx =>
            ctx.Request.UserAgent.IndexOf("iPad", StringComparison.OrdinalIgnoreCase) >= 0 ||
            ctx.Request.UserAgent.IndexOf("Android", StringComparison.OrdinalIgnoreCase) >= 0 && 
            ctx.Request.UserAgent.IndexOf("mobile", StringComparison.OrdinalIgnoreCase) < 1)
        });

        DisplayModeProvider.Instance.Modes.Insert(1, new DefaultDisplayMode("Mobile")
        {
            ContextCondition = (ctx =>
                ctx.GetOverriddenBrowser().IsMobileDevice)
        });