精华内容
参与话题
问答
  • Framework7 Full Featured Mobile HTML Framework For Building iOS & Android Apps Supporting Framework7 Framework7 is an MIT-licensed open source project with its ongoing development made possible ...
  • Framework7中文文档

    千次阅读 2016-02-29 15:43:00
    在正式开始阅读文档之前,我们十分推荐你从getting started引导开始,从该部分你可以学习到如何下载和配置framework7,并了解framework7的基本布局。 framework7的的学习难度是十分低的,只要你会HTML和CSS,对了解...

    欢迎开始使用framewor7制作高水平的iOS应用。

    在正式开始阅读文档之前,我们十分推荐你从getting started引导开始,从该部分你可以学习到如何下载和配置framework7,并了解framework7的基本布局。

    framework7的的学习难度是十分低的,只要你会HTML和CSS,对了解一点点的javascript,你就基本上懂得如何使用framework7去制作iOS应用了。

    为了更好地学习framework7,我们推荐你按顺序去阅读本文档。

    那我们先从最基本的应用HTML布局-App HTML Layout开始。

     

    https://www.zybuluo.com/kirkzwy/note/16048

     

    中文官网:http://f7cn.com/docs/#.VtaLjlJJTSo

    转载于:https://www.cnblogs.com/screw/p/5227710.html

    展开全文
  • framework7-icons, Framework7的免费iOS图标字体 Framework7图标Framework7的高级和免费ios图标字体。这种字体可以用在 Framework7插件中,但是你可以在任何地方看到它适合它,个人或者商业。 它是免费的使用和许可...
  • Framework7 +

    2015-11-18 16:24:38
    Framework7 框架,为framework7的补充,支持android版本,为了防止github访问不了
  • framework7

    2019-10-03 00:26:08
    Framework7 Framework7 是一个开源免费的框架可以用来开发混合移动应用(原生和HTML混合)或者开发 iOS & Android 风格的WEB APP。也可以用来作为原型开发工具,可以迅速创建一个应用的原型。 Framework7 最...

    Framework7

    Framework7 是一个开源免费的框架可以用来开发混合移动应用(原生和HTML混合)或者开发 iOS & Android 风格的WEB APP。也可以用来作为原型开发工具,可以迅速创建一个应用的原型。

    Framework7 最主要的功能是可以使用HTML、CSS和JS来开发iOS7应用。Framework7 是完全免费开源的。

    Framework7 并不能兼容所有的设备。她只专注于为 iOS 和 Google Material 设计提供最好的体验。

    如果你想开发 iOS 或者 Android 混合应用(Phonegap)或者你想开发 iOS 和 Google Material 风格的WEB APP,那么Framework7将会是你的首选。

    转载于:https://www.cnblogs.com/Yanss/p/10439052.html

    展开全文
  • framework7 demo

    2014-11-06 11:20:16
    framework7帮助文档
  • framework7-website, 用于提供和脱机使用的Framework7网站 Framework7-Websiteframework7网站以脱机使用这些文档http://framework7.io在 root 目录下运行 npm install 以安装npm软件包。 然后,你可以使用Gulp编译 ...
  • framework7.angular, Framework7与 Angular Js的集成尝试 http Framework7 + AngularJS 使用AngularJS强大的移动HTML框架构建 iOS & Android应用程序。 Anuglar 2集成( 正在开发中)https://github.com/ashvi
  • framework7-react-base, 将Framework7与简单的应用程序一起使用 Framework7-React-base这个应用展示了使用移动框架的例子- Framework7与构建数据驱动的联系人应用程序的反应。注释 !src目录包含JSX反应文件( ...
  • Framework7-Vue使用Framework7和Vue构建完整的iOS和Android应用程序
  • Framework7 操作手册

    2019-02-16 17:36:53
    Framework7 是一个开源免费的框架。可以用来开发混合移动应用(原生和 HTML 混合)或者开发 iOS & Android 风格的 WEB APP。也可以用来作为原型开发工具,可以迅速创建一个应用的原型。
  • framework7使用dome

    2015-08-12 20:11:26
    framework7小测试与练习。相机拍照,定位功能
  • framework7 - a css framework

    2018-10-27 23:39:00
    2019独角兽企业重金招聘Python工程师标准>>> ...

    https://framework7.io/

    转载于:https://my.oschina.net/swingcoder/blog/2253464

    展开全文
  • Framework7+Framework7-vue+vue踩坑记(三)

    千次阅读 2018-03-08 20:41:59
    原文地址:... 接上一篇博客 Framework7+Framework7-vue+vue踩坑记(二),这里继续 framework7 + vue + framework7-vue 踩坑第三波。 1. Notification组件 framework7-vue没有该组件,使...

    原文地址:https://yawuling.com/201707141526.html

    接上一篇博客 Framework7+Framework7-vue+vue踩坑记(二),这里继续 framework7 + vue + framework7-vue 踩坑第三波。


    1. Notification组件

    framework7-vue没有该组件,使用framework7的方式实现,代码如下:

    this.$f7.addNotification({
      title: 'Framework7',
      message: 'This is a simple notification message with title and message'
    })
    
    2. picker组件

    framework7-vue没有该组件,使用framework7的方式实现,代码如下:

    <f7-list form>
      <f7-list-item>
        <f7-input type="text" placeholder="Your iOS device" id="picker-device">
        </f7-input>
      </f7-list-item>
    </f7-list>
    
    <script>
    export default {
      mounted () {
        let pickerDevice = this.$f7.picker({
          input: '#picker-device',
          cols: [
            {
              textAlign: 'center',
              values: [
                'iPhone 4',
                'iPhone 4S',
                'iPhone 5',
                'iPhone 5S',
                'iPhone 6',
                'iPhone 6 Plus',
                'iPad 2',
                'iPad Retina',
                'iPad Air',
                'iPad mini',
                'iPad mini2',
                'iPad mini3']
            }
          ]
        })
      }
    }
    </script>
    
    3. 下拉刷新

    下拉刷新是在f7-page中加上pull-to-refresh,以下是代码实现:

    <template>
      <f7-page pull-to-refresh @ptr:refresh="onRefresh">
        <f7-navbar title="Pull To Refresh" back-link="Back" slding>
          <f7-nav-right>
            <f7-link icon="icon icon-bars" open-panel="left"></f7-link>
          </f7-nav-right>
        </f7-navbar>
        <f7-list media-list>
          <f7-list-item v-for="item in items"
            :media="item.media"
            :title="item.title"
            :subtitle="item.subtitle"
          ></f7-list-item>
          <f7-list-label>
            <p>
              <div>Just pull page down to let the magic happen.</div>
              <div>
                Note that pull-to-refresh feature is optimised for 
                touch and native scrolling so it may not work on 
                desktop browser.
              </div>
            </p>
          </f7-list-label>
        </f7-list>
      </f7-page>
    </template>
    
    <script>
    export default {
      data () {
        return {
          items: [
            {
              media: '![](./static/image/photo12.jpg)',
              title: 'Yellow Submarie',
              subtitle: 'Beatles'
            }, {
              media: '![](./static/image/photo13.jpg)',
              title: 'Don\'t Stop Me Now',
              subtitle: 'Queen'
            }, {
              media: '![](./static/image/photo14.jpg)',
              title: 'Billie Jean',
              subtitle: 'Michael Jackson'
            }
          ]
        }
      },
      methods: {
        onRefresh: function () {
          let self = this
    
      setTimeout(<span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params"></span>) </span>{
        <span class="hljs-keyword">let</span> songs = [
          <span class="hljs-string">'Yellow Submarine'</span>,
          <span class="hljs-string">'Don\'t Stop Me Now'</span>,
          <span class="hljs-string">'Billie Jean'</span>,
          <span class="hljs-string">'Californication'</span>
        ]
        <span class="hljs-keyword">let</span> authors = [
          <span class="hljs-string">'Beatles'</span>,
          <span class="hljs-string">'Queen'</span>,
          <span class="hljs-string">'Michael Jackson'</span>,
          <span class="hljs-string">'Red Hot Chili Peppers'</span>
        ]
        <span class="hljs-keyword">let</span> item = {
          <span class="hljs-attr">media</span>: <span class="hljs-string">'&lt;img src="./static/image/photo'</span> + 
                  <span class="hljs-built_in">Math</span>.floor(<span class="hljs-built_in">Math</span>.random() * <span class="hljs-number">14</span>) +
                 <span class="hljs-string">'.jpg" width="44" /&gt;'</span>,
          <span class="hljs-attr">title</span>: songs[<span class="hljs-built_in">Math</span>.floor(<span class="hljs-built_in">Math</span>.random() * songs.length)],
          <span class="hljs-attr">subtitle</span>: authors[<span class="hljs-built_in">Math</span>.floor(<span class="hljs-built_in">Math</span>.random() * authors.length)]
        }
    
        self.items.unshift(item)
    
        self.$f7.pullToRefreshDone()
      }, <span class="hljs-number">2000</span>)
    }
    

    }
    }
    </script>

    4. View间链接

    将在 left view 中的链接加载的页面放进 main view中,在 a 标签上加上 data-view="###" (###为css选择器)即可

    5. sortable list

    f7-listsortable属性为true时,通过v-for="item in items"循环渲染列表,触发@sortable:sort事件时,不能对items进行操作,framework7-vuesortable并没有操作items,而是对Dom树的操作,而v-for是先完成virtual dom树的修改再比对修改前的virtual dom树,然后对Dom树只修改变化的部分,而不是重排,这样会导致Dom树的列表又再一次按照我们之前的操作排列一次

    6. f7-swiper

    该组件使用nested布局时无法正常显示导航条,使用原生实现,主要是该vue组件f7-swiper中的内容全放到.swiper-wrapper中,因此就算自定义导航条的css选择器也无法正常显示


    至此,官网的demo已重构完毕,目前发现的需要注意的点就这些。

    Framework7+Framework7-vue+vue踩坑记(一)
    Framework7+Framework7-vue+vue踩坑记(二)

    使用 framework7-vue 重构后的项目地址:vue-framework7,欢迎star

    项目初始化时,framework7 的参数中,cache 设置为 false 无效,原因未知。

          </div>
        </div>
    
    展开全文
  • Framework7+Framework7-vue+vue踩坑记(一)

    千次阅读 2018-03-08 20:38:58
    网上关于framework7-vue的博客基本没有,所以我决定用它来重构官网的Demo,来踩波坑,以下是我在使用framework7-vue时遇到的一些需要注意的点 1、this指向 在定时器和framework7的api回调函数中,this会被修改...
  • Framework7+Framework7-vue+vue踩坑记(二)

    千次阅读 2018-03-08 20:40:50
    原文地址:... 接上一篇博客 Framework7+Framework7-vue+vue踩坑记(一),这里继续framework7+vue+framework7-vue踩坑第二波,同样通过重构官网demo来运用framework-vue。 1、f7-message组件图片显...
  • 在引入了相应框架中css与js文件之后,需要通过new生成Framework7实例进行应用初始化(初始化对象是HTML中已经存在且需要浏览的view)const app=new Framework7(options);//其中实例中options参数为对象,用于配置app...
  • 1.安装说明 ...出现的问题:在win7 上安装dotNetFx40_Full_x86_x64.exe之后,弹出说明框:.Net framework 4安装未成功,原因是hresult 0x80240037 后面也采用了各种方法,还发现这种错误:你的电脑使用此 Win
  • <p>I have a simple <code><...framework7.js:7573handleLiveEvent @ framework7.js:11488 </code></pre> <p>I am new to <code>Framework7</code>. I have purchased a template for development. </div>
  • Framework7 上传附件

    2019-06-28 16:27:28
    前台: <input type="file" name="uploadfiles" id="wkstUploadfiles" @change="uploadWorksheetFile" /> <script> return { methods() { uploadWorksheetFile:function(){ ...
  • Framework7学习总结

    千次阅读 2017-03-06 00:15:58
    1、Framework7中文教程-APP 基本HTML结构
  • Framework7 下载附件

    2019-06-26 11:34:53
    Framework7中利用download和external实现a标签下载文件和图片 <a href="img/img.png" class="external" download > 转自:https://blog.csdn.net/m0_37593616/article/details/78874717 ...
  • vue+framework7

    千次阅读 2018-09-23 00:25:57
    vue+framework7 vue/cli3搭建vue项目: # 安装vue/cli3 npm install -g @vue/cli # 查看vue版本 vue -version # 创建一个vue项目,f7-vue为项目名 vue create f7-vue # 运行 npm run serve 由于Eslint比较烦人,不...
  • Framework7 页面 路由

    2018-08-10 15:04:37
    默认情况下 Framework7 会使用 Ajax 加载所有的页面,除了带有 external class的链接(&lt;a href="somepage.html" class="external"&gt;)和没有正确 href 值的链接(比如是空的或者是...
  • Framework7 框架简介

    千次阅读 2014-05-24 22:49:23
    什么是 Framework7 Framework7 是一款免费开源的移动web开发框架(类似的知名框架有Jquery Mobile,sencha),用以开发IOS7风格、体验的混合移动应用和web应用。如果你需要,它还是一款绝好的移动应用原型框架,用以...
  • 使用framework7总结

    2018-11-06 22:52:00
    2019独角兽企业重金招聘Python工程师标准>>> ...
  • Framework7 自定义样式

    2018-09-21 14:13:26
    pp class名,来自定义样式,这样官方固定的样式就会失效,如果不加#app 你写不起作用的,如果你自己写的样式就不用加#app。   使用背景图片 &lt;div class="pages"&gt; ...
  • Framework7 无限滚动

    2017-12-14 03:09:48
    //*将Dom7导出到本地变量* ...var myApp = new Framework7(); //*初始化视图* var mainView = myApp.addView(".view-main",{ domCache: true }); //*无限滚动* // *加载flag* var loading = false; // *上次...

空空如也

1 2 3 4 5 ... 20
收藏数 15,043
精华内容 6,017
关键字:

framework7