适用于 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 中，但是如果您使用的是“精简版”版本，现在它嵌入在 FiftyOne.Foundation.dll 中。

要修复 iPhone，这是一个区分大小写的测试。 FiftyOne 将 MobileDeviceModel 设置为“IPhone”（大写 I） - 这适用于电动李子 iphone 模拟器。

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

最后，您需要注意如何将这些项目插入到集合中。上面的代码插入了 Android 规则，然后插入了 iPhone 规则（因此 android 现在位于集合中的位置 1），然后将 Mobile 规则插入到位置 1 - 所以集合最终看起来像： 苹果手机 移动的 安卓

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

为了适应 ASP.Net MVC 4 初始化风格，我将此代码分离到其自己的类中的 APP_Start 文件夹中，即。

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);
    }