语言: ENCN

Framework7应用基本布局案例

以下列出来的案例,都是可以直接应用到你的App里的基本布局例子。

点击下载案例

单页布局应用

单页布局是应用最广的一种布局类型,包含了路由器、导航栏、工具栏和侧边栏。

在新窗口打开

标签栏应用

标签栏布局最重要的一点就是,每个标签项都是一个独立的视图,包括独立的路由器和导航。

每个标签项可以有不同的布局,不同的导航类型(动态、固定或静态)或者没有导航栏。

在新窗口打开

分隔视图应用

分隔视图应用,通常适用于iPad应用。最主要的特点就是你可以同时看到不同的视图界面。

每个视图可以有不同的布局,不同的导航类型(动态、固定或静态)或者没有导航栏。

在新窗口打开

Split View Application With Degradation To Panel

This is an example of split view application layout where left view degrades to panel on narrow screens (iPad portrait and iPhone). It behaves like default Mail app on iOS 7.

Just click link below to open app in new window, and resize browser to see it in action.

在新窗口打开

内联页面

使用内联布局,这种布局下的所有页面内容本身已经加载到DOM,并不需要通过ajax加载。

在新窗口打开

Template7 Pages

This examples shows how you can use built-in template engine to load pages and fill them automatically with specified data

在新窗口打开

AngularJS Template

A clean and simple template for Framework7 based on AngularJS with pure HTML5, CSS3 and JS

在新窗口打开下载源码