DevExpress控件使用交流,DevExpress中国社区Dev联系电话 联系电话:023-68661681

用DevExpress ASP.NET控件创建iOS Web应用程序

来源:本站原创   发布时间:2012-05-16   浏览:2572次

为iOS建立一个ASP.NET Web应用程序,是指确保它看起来和用起来就像一个本地的IOS应用程序一样。点击查看视频介绍

让我告诉你如何使用DevExpress ASP.NET控件建立一个iOS ASP.NET Web应用程序。

项目准备

首先,我们要创建一个新的空的ASP.NET Web应用。

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

然后复制IOS主题文件App_Themes文件夹。(注意:IOS主题文件都在示例项目中附着在底部)

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

然后将iOS主题导入到项目中,将它应用到你的Default.aspx页。

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

我们的应用程序的核心是TabBar。我们将使用ASPxPageControl模仿它

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

从工具箱拖动出ASPxPageControl设置它的SkinIDTabBar。

<body>
      <form id="form1" runat="server">
        <dx:ASPxPageControl runat="server" ID="TabBar" SkinID="TabBar"
           ActiveTabIndex="0">
          <TabPages>
            <dx:TabPage>
              <ContentCollection>
                <dx:ContentControl runat="server" SupportsDisabledAttribute="True">
                </dx:ContentControl>
              </ContentCollection>
            </dx:TabPage>
          </TabPages>
          <ClientSideEvents
             Init="OnTabBarInit"
             ActiveTabChanged="function(){ Adjust(); }"/>
        </dx:ASPxPageControl>
      </form>
  </body>  

并指派两个客户端事件:

  • Init: 控件初始化时,将被激活。
  • ActiveTabChanged: 当标签页改变时,将被激活。

我们需要这样做,以确保TabBar是在页面的底部。

<script type="text/javascript">
      function Adjust() {
        TabBar.SetHeight(ASPxClientUtils.GetDocumentClientHeight());
      }
      function OnTabBarInit() {
        ASPxClientUtils.AttachEventToElement(window, "orientationchange",
            function () { Adjust(); }, false);
        if (!ASPxClientUtils.touchUI) {
          ASPxClientUtils.AttachEventToElement(window, "resize",
            function () { Adjust(); }, false);
        }        Adjust();
      }
</script>  

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

创建应用程序界面

通过添加新的标签页来添加应用程序界面。

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

设置每个标签的宽为79像素、高为42像素。

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

现在一切都准备好了!

使用DevExpress ASP.NET控件建立iOS ASP.NET Web应用程序

点击这里下载示例项目!

本站文章除注明转载外,均为本站原创或翻译
欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
转载请注明:文章转载自:DevExpress控件中文网 [https://www.devexpresscn.com/]
本文地址:https://www.devexpresscn.com/post/195.html
在线
客服
微信
QQ 电话
023-68661681
返回
顶部