适用于iPhone,Android的特定视图(Asp.net MVC)

Question

我在用 ..

• ASP.net MVC 4
• 51Degrees.mobi
• jQuery Mobile

通过这些技术的帮助,我可以使我的Web应用程序的UI设计不仅在基于桌面的浏览器上看起来很好,而且在基于移动的浏览器上看起来也不错,而不需要我单独创建项目.

但是当谈到更具体的移动设备时,我想调用特定的视图文件.
所以我在Global.asax文件中使用下面的代码.

    protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();
        //The Android view
        DisplayModes.Modes.Insert(0, new DefaultDisplayMode("android")
        {                
            ContextCondition = Context => Context.Request.Browser.Platform == "Android"
        });

        //The iPhone view
        DisplayModes.Modes.Insert(0, new DefaultDisplayMode("iphone")
        {
            ContextCondition = Context => Context.Request.Browser.MobileDeviceModel == "iPhone"                
        });

        //The mobile view
        //This has a lower priority than the other two so will only be used by a mobile device
        //that isn't Android or iPhone
        DisplayModes.Modes.Insert(1, new DefaultDisplayMode("mobile")
        {
            ContextCondition = Context => Context.Request.Browser.IsMobileDevice                
        });

        RegisterGlobalFilters(GlobalFilters.Filters);
        RegisterRoutes(RouteTable.Routes);
    }

不幸的是,Android and IPhone specific view每当我从IPhone Emulator和Opera Mobile Emulator调用页面时都不加载.

_Layout.cshtml   [loaded from desktop based browser]
_Layout.Android.cshtml [never loaded]
_Layout.iPhone.cshtml  [never loaded]
_Layout.Mobile.cshtml  [loaded from mobile based any browser including iphone, opera] 

我认为有些不对的是当我使用NuGet包从51Degrees.mobi下载时,我只得到两个文件.

FiftyOne.Foundation.dll
51Degrees.mobi.config

即使我认为我应该得到,App_Data/Devices.dat但我仍然只从51Degrees.mobi获得这两个文件.

任何人都可以给我一个建议,如何调用iPhone和Android的特定视图？每个建议都将不胜感激.

Answer 1

我刚刚完成了这个并且有相同的行为.对于初学者来说,NuGet包是正确的.device.dat文件曾经存储在APP_Data中,但是如果您使用的是'lite'版本,那么它现在嵌入在FiftyOne.Foundation.dll中.

为了修复iPhone,这是一个案例判断测试.FiftyOne将MobileDeviceModel设置为'IPhone'(大写I) - 这与电动梅花iphone仿真器配合使用.

对于Android工作,似乎'lite'版本没有将平台设置为'Android'.简单的解决方法是使用UserAgent字符串.即ContextCondition = Context => Context.GetOverriddenUserAgent().包含("Android")

最后,您需要注意如何将这些项插入到集合中.上面的代码插入Android规则然后插入IPhone规则(因此android现在位于集合中的位置1)然后将Mobile规则插入位置1 - 因此集合最终看起来像:IPhone Mobile Android

因此,Android设备将始终首先选择Mobile规则,并且永远不会显示Android特定的浏览器页面.因此,按上面的顺序将插入更改为0,1和2.这给出了与代码相同的顺序,一切正常.

为了适应ASP.Net MVC 4初始化风格,我将这个代码分离到它自己的类中的APP_Start文件夹即ie.

public class DeviceConfig
{
    public static void RegisterDevices(IList<IDisplayMode> modes)
    {
        //The Android view
        modes.Insert(0, new DefaultDisplayMode("android")
        {
            ContextCondition = Context => Context.GetOverriddenUserAgent().Contains("Android")
        });

        //The iPhone view
        modes.Insert(1, new DefaultDisplayMode("iphone")
        {
            ContextCondition = Context => Context.Request.Browser.MobileDeviceModel == "IPhone"
        });

        //The mobile view
        //This has a lower priority than the other two so will only be used by a mobile device
        //that isn't Android or iPhone
        modes.Insert(2, new DefaultDisplayMode("mobile")
        {
            ContextCondition = Context => Context.Request.Browser.IsMobileDevice
        });
    }
}

然后在Global.asax.cs中

    protected void Application_Start()
    {
        AreaRegistration.RegisterAllAreas();

        FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
        RouteConfig.RegisterRoutes(RouteTable.Routes);
        BundleConfig.RegisterBundles(BundleTable.Bundles);
        DeviceConfig.RegisterDevices(DisplayModeProvider.Instance.Modes);
    }