zaixianshouce
zaixianshouce

移动端安卓和IOS开发框架Framework7教程-列表（表格）

常在iOS应用中看到的列表，是种多功能且强大的交互组件。列表将数据展现在一个可滚动的多行的列表中，可以将数据划分成不同的片段/组（sections/groups）。

列表有以下用途：

  • 让用户可以浏览结构化的多级数据
  • 展现一个索引列表
  • 在可视化的不同分组中，显示详细信息和控件
  • 展现一个可以选择的列表

列表布局

现在让我们看一下常见的列表布局

列表区（List block）

列表区（List block）是你的列表元素的容器，基本和内容区(Content Block)一样，只不过面向列表元素。

首先, 所有的列表元素都要被包裹在含有“list-block”类的元素中：

  1. <div class="list-block">
  2.     <ul>
  3.         ... list elements here ...
  4.     </ul>
  5. </div>
复制

不要将带有list-block类的元素放置在“content-block”中!

列表区标签（List block label）

你可以将列表区标签（List block label）加在列表区（List block）的末尾：

  1. <div class="list-block">
  2.     <ul>
  3.         ... list elements here ...
  4.     </ul>
  5.     <div class="list-block-label">List block label text</div>
  6. </div>
复制

列表项目（List item/element）

单个列表项目的布局相当复杂而灵活：

  1. <li>
  2.     <div class="item-content">
  3.         <div class="item-media">
  4.             <i class="icon my-icon"></i>
  5.         </div>
  6.         <div class="item-inner">
  7.             <div class="item-title">
  8.                 List element title
  9.             </div>
  10.             <div class="item-after">
  11.                 List element label
  12.             </div>
  13.         </div>
  14.     </div>
  15. </li>
复制

其中：

  • item-content - item-media和item-inner的主要弹性(flex)容器。必选元素。

    • item-media - 媒体元素（如图标，图片等）的容器。可选元素。

    • item-inner - item-title和item-after的主要弹性(flex)容器。必选元素。

      • item-title - 单行列表项目标题。必选元素。

      • item-after - 列表项目标签。可以包含任意额外的html元素（例如标签文本、徽章、switch/toggle、按钮等等）。可选元素。

  • 因为.item-content元素的是display属性是flex-box, 需要注意，“item-media”和“item-inner”应该是“item-content”的直接子元素!

  • 同样的，“item-title”和“item-after”应该是“item-inner”的直接子元素!

同时需要注意，如果你的列表项目不含其它元素, 你可以把“item-content”类直接加在<li>元素上：

  1. <li class="item-content">
  2.     <div class="item-media">
  3.         <i class="icon my-icon"></i>
  4.     </div>
  5.     <div class="item-inner">
  6.         <div class="item-title">
  7.             List element title
  8.         </div>
  9.         <div class="item-after">
  10.             List element label
  11.         </div>
  12.     </div>
  13. </li>
复制

示例

  1. <body>
  2.   ...
  3.   <div class="page-content">
  4.     <div class="content-block-title">Full Layout</div>
  5.     <div class="list-block">
  6.       <ul>
  7.         <li class="item-content">
  8.           <div class="item-media"><i class="icon icon-f7"></i></div>
  9.           <div class="item-inner">
  10.             <div class="item-title">Item title</div>
  11.             <div class="item-after">Label</div>
  12.           </div>
  13.         </li>
  14.         <li class="item-content">
  15.           <div class="item-media"><i class="icon icon-f7"></i></div>
  16.           <div class="item-inner">
  17.             <div class="item-title">Item with badge</div>
  18.             <div class="item-after"><span class="badge">5</span></div>
  19.           </div>
  20.         </li>
  21.         <li class="item-content">
  22.           <div class="item-media"><i class="icon icon-f7"></i></div>
  23.           <div class="item-inner">
  24.             <div class="item-title">Another item</div>
  25.             <div class="item-after">Another label</div>
  26.           </div>
  27.         </li>
  28.       </ul>
  29.       <div class="list-block-label">List block label text goes here</div>
  30.     </div>
  31.     <div class="content-block-title">Only titles</div>
  32.     <div class="list-block">
  33.       <ul>
  34.         <li class="item-content">
  35.           <div class="item-inner">
  36.             <div class="item-title">Item title</div>
  37.           </div>
  38.         </li>
  39.         <li class="item-content">
  40.           <div class="item-inner">
  41.             <div class="item-title">Item with badge</div>
  42.           </div>
  43.         </li>
  44.         <li class="item-content">
  45.           <div class="item-inner">
  46.             <div class="item-title">Another item</div>
  47.           </div>
  48.         </li>
  49.       </ul>
  50.     </div>
  51.   </div>
  52. </body>
复制

实例预览

链接元素

当然，多数情况下我们需要将列表中的元素当作链接使用(<a>)，来指向其他页面或者其他数据。在这种情况下，我们需要将“item-content”包裹在<a class="item-link">元素中：

  1. <a href="#" class="item-link">
  2.   <div class="item-content">
  3.     <div class="item-media">...</div>
  4.     <div class="item-inner">...</div>
  5.   </div>
  6. </a>
复制

 

如果你的链接只包含“item-content”，那我们可以直接将链接作为“item-content”：

  1. <a href="#" class="item-link item-content">
  2.   <div class="item-media">...</div>
  3.   <div class="item-inner">...</div>
  4. </a>
复制

注意，当“item-inner”在“item-link”中时，会有额外的右内边距（right padding）和chevron icon

示例

  1. <div class="list-block">
  2.   <ul>
  3.     <li>
  4.       <a href="#" class="item-link item-content">
  5.         <div class="item-media"><i class="icon icon-f7"></i></div>
  6.         <div class="item-inner">
  7.           <div class="item-title">Item title</div>
  8.           <div class="item-after">Label</div>
  9.         </div>
  10.       </a>
  11.     </li>
  12.     <li>
  13.       <a href="#" class="item-link item-content">
  14.         <div class="item-media"><i class="icon icon-f7"></i></div>
  15.         <div class="item-inner">
  16.           <div class="item-title">Item with badge</div>
  17.           <div class="item-after"><span class="badge">5</span></div>
  18.         </div>
  19.       </a>
  20.     </li>
  21.     <li>
  22.       <a href="#" class="item-link item-content">
  23.         <div class="item-media"><i class="icon icon-f7"></i></div>
  24.         <div class="item-inner">
  25.           <div class="item-title">Another item</div>
  26.           <div class="item-after">Another label</div>
  27.         </div>
  28.       </a>
  29.     </li>
  30.   </ul>
  31.   <div class="list-block-label">List block label text goes here</div>
  32. </div>
复制

实例预览

列表分割元素（List Divider）

列表分隔元素是一个简单的列表元素并包含标题，它在视觉上分隔两个列表元素：

  1. <li class="item-divider">Divider title here</li>
复制

 

  1. <div class="list-block">
  2.   <ul>
  3.     <li class="item-content">
  4.       <div class="item-media"><i class="icon icon-f7"></i></div>
  5.       <div class="item-inner">
  6.         <div class="item-title">Item title</div>
  7.         <div class="item-after">Label</div>
  8.       </div>
  9.     </li>
  10.     <li class="item-content">
  11.       <div class="item-media"><i class="icon icon-f7"></i></div>
  12.       <div class="item-inner">
  13.         <div class="item-title">Title</div>
  14.       </div>
  15.     </li>
  16.     <!-- 分隔元素 -->
  17.     <li class="item-divider">Divider title here</li>
  18.     <li class="item-content">
  19.       <div class="item-media"><i class="icon icon-f7"></i></div>
  20.       <div class="item-inner">
  21.         <div class="item-title">Item with badge</div>
  22.         <div class="item-after"><span class="badge">5</span></div>
  23.       </div>
  24.     </li>
  25.     <li class="item-content">
  26.       <div class="item-media"><i class="icon icon-f7"></i></div>
  27.       <div class="item-inner">
  28.         <div class="item-title">Another item</div>
  29.         <div class="item-after">Another label</div>
  30.       </div>
  31.     </li>
  32.   </ul>
  33.   <div class="list-block-label">List block label text goes here</div>
  34. </div>
复制

实例预览

分组列表（Grouped Lists）

有时我们需要将列表区里的元素分组，在这种情况下，我们需要用额外的分组元素：

  1. <div class="list-block">
  2.   <!-- First group-->
  3.   <div class="list-group">
  4.     <ul>
  5.       <li class="list-group-title">First group</li>
  6.       <li class="item-content">
  7.         <div class="item-media"><i class="icon icon-f7"></i></div>
  8.         <div class="item-inner">
  9.           <div class="item-title">Item title</div>
  10.           <div class="item-after">Label</div>
  11.         </div>
  12.       </li>
  13.       <li class="item-content">
  14.         <div class="item-media"><i class="icon icon-f7"></i></div>
  15.         <div class="item-inner">
  16.           <div class="item-title">Item with badge</div>
  17.           <div class="item-after"><span class="badge">5</span></div>
  18.         </div>
  19.       </li>
  20.       ...
  21.     </ul>
  22.   </div>
  23.   <!-- Second group-->
  24.   <div class="list-group">
  25.     <ul>
  26.       <li class="list-group-title">Second Group</li>
  27.       <li class="item-content">
  28.         <div class="item-media"><i class="icon icon-f7"></i></div>
  29.         <div class="item-inner">
  30.           <div class="item-title">Item title</div>
  31.           <div class="item-after">Label</div>
  32.         </div>
  33.       </li>
  34.       <li class="item-content">
  35.         <div class="item-media"><i class="icon icon-f7"></i></div>
  36.         <div class="item-inner">
  37.           <div class="item-title">Item with badge</div>
  38.           <div class="item-after"><span class="badge">5</span></div>
  39.         </div>
  40.       </li>
  41.       ...
  42.     </ul>
  43.   </div>
  44. </div>
复制

实例预览

也许你会问分组元素和分隔元素有什么区别？如果使用了分组元素，当在分组内部滚动时，标题会保持在固定位置。

内嵌列表区域（Inset List Block）

列表区还有内嵌（非全屏）样式，只需要给列表区域元素加上“inset”类：

  1. <div class="list-block inset">
  2.   <ul>
  3.     ...
  4.   </ul>
  5. </div>
    复制

使用“tablet-inset”类，可以使列表区在iPad下以内嵌的方式显示，而在iPhone中以普通样式显示：

  1. <div class="list-block tablet-inset">
  2.   <ul>
  3.     ...
  4.   </ul>
  5. </div>
    复制

实例预览

 

你可能感兴趣的:(Framework7)

  • framework7使用记录 斯蒂芬加油啊
    1.在使用popover弹窗时，关闭弹窗方法，myApp.closeModal()2.获取元素css属性值，$$(".xxx").css("属性名","属性值")
  • 2018-10-09 007QQQQQQ
    SUI是一套基于bootstrap开发的前端组件库，同时她也是一套设计规范。通过SUI，可以非常方便的设计和实现精美的页面。SUIMobile是一套基于Framework7开发的UI库。它非常轻量、精美，只需要引入我们的CDN文件就可以使用，并且能兼容到iOS6.0+和Android4.0+，非常适合开发跨平台WebApp。
  • 二.移动端组件库 小茅同学
    Snipaste_2021-08-移动-56-38.png一.关于移动端组件库下面是AwesomeVue收集的一些优质的第三方组件库资源。UIframeworksformobileFramework7-Vue-BuildfullfeaturediOS&AndroidappsusingFramework7&Vue.vux-[Chinese]VueUIComponentsbasedonWeUI.vue
  • ef mysql 优化_C#实用杂记-EF全性能优化技巧 蛋蛋兽的一生 efmysql优化
    EntityFramework目前最新版本是6.1.3，当然EntityFramework7目前还是预览版，并不能投入正式生产环境，估计正式版16年第一季度会出来，了解过EF7的部分新特性后，还是狠狠期待一下滴。EF性能问题一直为开发者所诟病，最让人纠结的也是这块，所以此次我也来谈谈EF的性能优及建议。既然是把优化点列举出来，可能有些地方关于底层的知识就不会介绍的太深刻，权当抛砖引玉吧。先说说EF
  • Laravel学习笔记汇总——Laravel的目录结构 与非学堂 PHPLaravel学习记录phplaravel
    ##Laravel学习笔记汇总——Laravel的目录结构//使用下面语句查看当前版本：//phpartisan--version#LaravelFramework7.30.1.├──app#存放我们所开发应用的核心代码│├──Broadcasting#通过phpartisanmake:channel产生，存放所有broadcastchannelclasses│├──Console#所有应用中自定
  • 跨平台运行ASP.NET Core 1.0 weixin_34413065 运维网络git
    前言首先提一下微软更名后的叫法：ASP.NET5更名为ASP.NETCore1.0.NETCore更名为.NETCore1.0EntityFramework7更名为EntityFrameworkCore1.0或者简称EFCore1.0现在伴随着ASP.NETCore1.0RC2版的更新速度，许多官方文档都跟不上，还停留在RC1版的使用方式上（RC1版是继Beta版之后第一个发布的稳定版本）。RC1
  • 跨平台运行ASP.NET Core 1.0（转载） weixin_30685029 运维网络git
    前言首先提一下微软更名后的叫法：ASP.NET5更名为ASP.NETCore1.0.NETCore更名为.NETCore1.0EntityFramework7更名为EntityFrameworkCore1.0或者简称EFCore1.0现在伴随着ASP.NETCore1.0RC2版的更新速度，许多官方文档都跟不上，还停留在RC1版的使用方式上（RC1版是继Beta版之后第一个发布的稳定版本）。RC1
  • Swiper手动滑动后，自动滑动失效问题解决 Weastsea
    framework7框架访问地址:https://framework7.io/vue/swiper.htmlSwiperAPI:http://idangero.us/swiper/api/本代码使用framework7+vue框架，使用了SwiperAPI来解决轮播滑动问题。一开始代码是这样的，注意示例不能运行，调试时发现，页面加载出来的时候图片可以轮播，但是手动滑动之后，页面的图片不再自动轮播。
  • cordova-framework7-pushstate donotlb
    起因最近在开发一个app,技术栈是:cordova+framework7+vue,当把APP(android版)放到真机上运行时发现:返回键或者返回手势(全面屏)无法正常工作,会直接退出APP,这个问题的解决思路有两个:绑定backbutton事件-cordovadocs但是注意:该事件ios平台不支持启用pushstate,让webview的导航(前进/后退)功能生效framework7的作者推
  • python django restful框架_【2020Python修炼记】Django Rest Framework-1-DRF简介+RESTful入门规范... 曲水流觞不醉人 pythondjangorestful框架
    【目录】day11web开发模式2API接口3postman的使用4restful的规范5序列化/反序列化6DjangoRest_Framework7drf的安装和使用8cbv源码回顾1web开发模式在开发Web应用中，有两种应用模式：1.1前后端不分离1.2前后端分离2API接口-1=API接口的用处为了在团队内部形成共识、防止个人习惯差异引起的混乱，我们需要找到一种大家都觉得很好的接口实现规范
  • 分享一款自带工作流引擎的NodeJS全栈框架，接单快手、创业神器 zhennann Cabloynode.js
    CabloyJS是什么CabloyJS是一款自带工作流引擎的Node.js全栈框架,接单快手、创业神器,基于koa+egg+vue+framework7+mysql在线演示场景链接/二维码PC端https://test.cabloy.com/Mobile端谁会用这款Node.js全栈框架？>>>>>1.外包接单痛点：客户希望项目按质如期完工、价格低、风险小；服务商希望毛利高、投入少、进度快、客户满
  • FreamWork7-v3.0+GetStart 待业的无业游民
    1、下载安装freamWork7-v3.0+等版本。下载地址：FreamWork7下载链接地址图1下载界面2、创建自己的项目图2创建项目4、导入FreamWork7将解压的文件夹下的“packages”文件夹复制粘贴到新创建的项目中图3导入文件5、引用FreamWork7对应的JS和CS图4引入JS、CSS文件7、初始化Appvarapp=newFramework7({root:'#app',na
  • [SkylerAI]零碎知识点13-JS阻止事件冒泡和默认行为 SkylerAI
    参考链接：https://www.cnblogs.com/yuqingfamily/p/5940369.html亲测如下：Framework7中若使用以下方式绑定事件varbindings=[{element:".advertImg",event:"click",handler:function(){myApp.closeModal(popover);window.location.href="x
  • 常用网站收录 倔强的满腔热血
    前端框架amazeui移动端框架组件丰富http://amazeui.org/创建IOS风格的webAPP框架http://framework7.taobao.org/Bootstrap前端必备http://www.bootcss.com/类库Jquery类库http://jquery.cuishifeng.cn/知识体系前端知识体系http://www.cnblogs.com/sb1987102
  • Bootstrap框架 CNLISIYIII
    css框架：对css相同功能的整体封装，方便使用。常见css框架：AmazeUI；Framework7；Bootstrap（一）Bootstrap用于开发响应式布局、移动设备优先的web项目。1.下载安装两种版本：1）编译且压缩后的CSS、Js和字体文件，不包含文档和源码；2）less、Js和字体文件的源码，带有文档。（此处下载了Bootstrap3.3.7版本）安装：Bootstrap101Te
  • SUI Mobile Cherie_Young iOSsuisui-mobile
    1介绍1.1概念SUIMobile是一套基于Framework7开发的UI库。它非常轻量、精美，只需要引入CDN文件就可以使用，并且能兼容到iOS6.0+和Android4.0+，适合开发跨平台WebApp。SUIMobile是阿里巴巴一个UED团队的作品，目的是为了手机H5页面提供一个常用的组件库，减少重复工作。1.2特点轻量级SUIMobile非常轻量，核心库压缩zip后的体积总共只有52Ki
  • 【金三银四】2022 Android面经实录 i小灰
    复习点1、项目经历，业务，难点2、Java基础,JVM，集合原理3、Android基础,View体系，View绘制流程，事件分发，屏幕刷新，动画原理4、常见三方库原理5、Jetpack6、AndroidFramework7、算法8、Kotlin具体链接1算法部分打遍天下二叉树https://github.com/xfhy/Android-Notes/blob/master/Blogs/Algori
  • 基于python的django框架数码电子产品销售交易商城电商平台设计 biyezuopin djangopython电子商城系统购物商城毕业设计
    目录摘要I目录III第一章绪论11.1课题研究背景及意义11.2国内外研究现状21.3本文的主要工作3第二章技术选型42.1Python42.2Django52.3MySQL62.4DjangoRestFramework72.5Vue8第三章系统分析93.1可行性分析93.2系统需求分析103.2.1业务需求分析103.2.2用户需求113.2.3功能需求分析123.2.4非功能需求分析14第四章
  • JavaEE——SpringBoot项目常见的依赖包及其作用 留家里哦哦哦 javaspringbootjava-eemybatis
    SpringBoot项目常见的依赖包及其作用建立时，常导入依赖包如下：1.SpringWeb2.spring-boot-devtools：3.Lombok4.Thymeleaf5.MySQLDriver6.MybatisFramework7.还有额外的依赖包建立时，常导入依赖包如下：大家可以根据需求来导入自己想要的（一般中途想重新加入一个依赖包可以再pom.xml里面dependencies里面插
  • 基于Django图书管理系统设计与实践 biyezuopin pythonDjango图书管理系统图书管理毕业设计
    目录摘要IAbstractII1绪论11.1选题背景及意义11.1.1选题背景11.1.2目的意义11.2研究现状21.3论文组织安排32开发工具及其技术42.1Python42.2Django52.3MySQL62.4DjangoRestFramework73需求分析83.1可行性研究83.1.1技术可行性83.1.2经济上的可行性83.1.3操作上的可行性83.2系统需求分析83.3程序流程图
  • 仿华为电商商城，官网，华为超级新品日demo,大屏霸气且简洁 愛芳芳 前端开发它不香么vue.jselementuijavascript前端html5
    1.技术vue+elementui实现，elementui2.华为超级新品日官网华为商城是华为公司旗下官方电商平台3.官方截图4.项目demo效果图5.安装启动vue项目（一）Vue——如何创建一个Vue项目(完整步骤)-㭌（mou）七-博客园6.elementui官网Element-Theworld'smostpopularVueUIframework7.如果你下载的是本项目源码，则步骤一中可以
  • Spring Boot整合Zookeeper详细教程 怪 咖@ zookeeperspringbootjava-zookeeperzookeeper
    目录1.Curator介绍2.创建springboot项目3.引⼊Curator4.application.yml配置⽂件5.读取配置⽂件注入到容器6.注⼊CuratorFramework7.添加测试方法8.执行测试方法报错解决注意我这里用的是官方最稳定的版本3.7.1，版本之间有个别命令是有差距的！本篇文章的示例SpringBoot和Zookeeper客户端以及zookeeper都是最新版本！1
  • 移动端UI库 dg_dot 移动端
    SUIMobileSUIMobile是一套基于Framework7开发的UI库风格类似iOS轻量，核心库压缩Gzip后的JS、CSS网络传输体积总共只有52K提供了20+个常用的组件能兼容到iOS6.0+和Android4.0+非常适合开发跨平台WebApp基于jQuery3.x搭建，性能远远超越Zepto版本MUI最接近原生APP体验的高性能前端框架不依赖任何第三方JS库，压缩后的JS和CSS文
  • Framework7 [v2] + vue Web开发 非梦nj
    framework7-vuedata-tabledemo原来的OB管理系统，是用的Framework7v1，现在更新到v2了。所以，我们也重构一下。主要是界面对Mobile更加友好！re-designofhttps://ourbits.herokuapp.comdata-tableforframework7andvue,supportsorting,httpgetapi,paginationetc
  • 推荐前端的学习网站 陈光展_Gz
    框架类1.Framework7Framework7是一款免费、开源的移动HTML框架，主要用于开发混合手机App或者网页App，某些应用场景的体验几乎与原生开发的iOS和Android应用一模一样，同时也是一款不可获取的应用原型快速开发及展示工具。
  • Framework7 vanTu
    前言现在单页面应用的开发已经越来越多，要做一款用户体验较好的混合应用，实现快速开发，其中Framework7就是一款免费开源的UI框架，完美兼容iOS主题，给人带来原生般的体验。简单介绍Framework7所给你带来的用户体验是jqm不能比拟的，组件做得很精致，其中一个最主要的特色就页面右滑返回上一页面，这个特性就基本跟原生iOS一模一样。Framework7不依赖任何第三方库，这个是特别好的，在
  • Error in mounted hook: "TypeError: i[0] is undefined" 天涯笑笑生
    问题：使用framework7vue框架的ScrollableTabbar时，Tab1Tab2错误截图image.png模板源码{{item}}{{item}}注：1.此bug只在非ios平台上运行时才显示已排除其他因素影响解决方案：暂时未找到
  • iOS如何优雅的解决-webkit-overflow-scrolling css属性问题 桥下醉翁
    在iOS的H5页面中，总是受到UIScrollView的阻尼效果困扰，今天提供一个优雅的解决方案1、本操作针只支持WKWebView，如果使用UIWebView出现不稳定效果，只能等以后更新处理。2、本操作在framework7框架中初步测试，并未进行深度测试。//简单，优雅的解决方案代码在这里html,body{height:100%;position:fixed;overflow:hidden
  • Framework7(06:视图(View)间链接) 廖马儿
    前言：我们有两个已经初始化完成的View（leftview和rightview)。这种情况下，所有在leftview中的链接加载的页面都会放在leftview中，所有在rightview中的链接加载的页面都会放在rightview中。但是我们现在需要一些在leftview中的链接加载的页面放进rightview中。这叫View间链接。.router.load()和.router.back()方法。
  • Framework7(05: Page,路由,页面刷新) 廖马儿
    1.路由器JSAPIFramework7中的路由器使用非常灵活，他可以有多种方式来处理Page:AjaxPages,从一个指定的URL加载页面，通常是另外一个页面的文件地址（默认行为）。通过JSAPI创建和加载动态页面如果你的页面已经写在DOM中了，那么你可以直接使用内联页面，而不用再去加载。可以加载使用Template7编写的模板可以在你的应用中混合使用所有上面的这些方法。视图是应用中的一个独立
  • 312个免费高速HTTP代理IP（能隐藏自己真实IP地址） yangshangchuan 高速免费superwordHTTP代理
        124.88.67.20:843 190.36.223.93:8080 117.147.221.38:8123 122.228.92.103:3128 183.247.211.159:8123 124.88.67.35:81 112.18.51.167:8123 218.28.96.39:3128 49.94.160.198:3128 183.20
  • pull解析和json编码 百合不是茶 androidpull解析json
    n.json文件: [{name:java,lan:c++,age:17},{name:android,lan:java,age:8}]   pull.xml文件 <?xml version="1.0" encoding="utf-8"?> <stu>     <name>java
  • [能源与矿产]石油与地球生态系统 comsci 能源
          按照苏联的科学界的说法,石油并非是远古的生物残骸的演变产物,而是一种可以由某些特殊地质结构和物理条件生产出来的东西,也就是说,石油是可以自增长的....       那么我们做一个猜想: 石油好像是地球的体液,我们地球具有自动产生石油的某种机制,只要我们不过量开采石油,并保护好
  • 类与对象浅谈 沐刃青蛟 java基础
           类，字面理解，便是同一种事物的总称，比如人类，是对世界上所有人的一个总称。而对象，便是类的具体化，实例化，是一个具体事物，比如张飞这个人，就是人类的一个对象。但要注意的是：张飞这个人是对象，而不是张飞，张飞只是他这个人的名字，是他的属性而已。而一个类中包含了属性和方法这两兄弟，他们分别用来描述对象的行为和性质（感觉应该是
  • 新站开始被收录后，我们应该做什么？ IT独行者 PHPseo
    新站开始被收录后，我们应该做什么？         百度终于开始收录自己的网站了，作为站长，你是不是觉得那一刻很有成就感呢，同时，你是不是又很茫然，不知道下一步该做什么了？至少我当初就是这样，在这里和大家一份分享一下新站收录后，我们要做哪些工作。       至于如何让百度快速收录自己的网站，可以参考我之前的帖子《新站让百
  • oracle 连接碰到的问题 文强chu oracle
    Unable to find a java Virtual Machine－－安装64位版Oracle11gR2后无法启动SQLDeveloper的解决方案 作者：草根IT网 来源：未知 人气：813标签： 导读：安装64位版Oracle11gR2后发现启动SQLDeveloper时弹出配置java.exe的路径，找到Oracle自带java.exe后产生的路径“C:\app\用户名\prod
  • Swing中按ctrl键同时移动鼠标拖动组件（类中多借口共享同一数据） 小桔子 java继承swing接口监听
            都知道java中类只能单继承，但可以实现多个接口，但我发现实现多个接口之后，多个接口却不能共享同一个数据，应用开发中想实现：当用户按着ctrl键时，可以用鼠标点击拖动组件，比如说文本框。 编写一个监听实现KeyListener,NouseListener,MouseMotionListener三个接口，重写方法。定义一个全局变量boolea
  • linux常用的命令 aichenglong linux常用命令
    1 startx切换到图形化界面 2 man命令:查看帮助信息 man 需要查看的命令,man命令提供了大量的帮助信息,一般可以分成4个部分 name:对命令的简单说明 synopsis:命令的使用格式说明 description:命令的详细说明信息 options:命令的各项说明 3 date:显示时间 语法：date [OPTION]... [+FORMAT]
  • eclipse内存优化 AILIKES javaeclipsejvmjdk
    一 基本说明      在JVM中，总体上分2块内存区,默认空余堆内存小于 40%时，JVM就会增大堆直到-Xmx的最大限制；空余堆内存大于70%时，JVM会减少堆直到-Xms的最小限制。     1)堆内存(Heap memory):堆是运行时数据区域，所有类实例和数组的内存均从此处分配,是Java代码可及的内存，是留给开发人
  • 关键字的使用探讨 百合不是茶 关键字
    //关键字的使用探讨/*访问关键词private 只能在本类中访问public 只能在本工程中访问protected 只能在包中和子类中访问默认的 只能在包中访问*//*final   类 方法 变量 final 类 不能被继承 final 方法 不能被子类覆盖，但可以继承 final 变量 只能有一次赋值，赋值后不能改变 final 不能用来修饰构造方法*///this()
  • JS中定义对象的几种方式 bijian1013 js
        1. 基于已有对象扩充其对象和方法(只适合于临时的生成一个对象)： <html> <head> <title>基于已有对象扩充其对象和方法(只适合于临时的生成一个对象)</title> </head> <script> var obj = new Object();
  • 表驱动法实例 bijian1013 java表驱动法TDD
    获得月的天数是典型的直接访问驱动表方式的实例，下面我们来展示一下： MonthDaysTest.java package com.study.test; import org.junit.Assert; import org.junit.Test; import com.study.MonthDays; public class MonthDaysTest { @T
  • LInux启停重启常用服务器的脚本 bit1129 linux
    启动，停止和重启常用服务器的Bash脚本，对于每个服务器，需要根据实际的安装路径做相应的修改   #! /bin/bash Servers=(Apache2, Nginx, Resin, Tomcat, Couchbase, SVN, ActiveMQ, Mongo); Ops=(Start, Stop, Restart); currentDir=$(pwd); echo
  • 【HBase六】REST操作HBase bit1129 hbase
    HBase提供了REST风格的服务方便查看HBase集群的信息，以及执行增删改查操作   1. 启动和停止HBase REST 服务 1.1 启动REST服务 前台启动（默认端口号8080） [hadoop@hadoop bin]$ ./hbase rest start   后台启动 hbase-daemon.sh start rest   启动时指定
  • 大话zabbix 3.0设计假设 ronin47
    What’s new in Zabbix 2.0? 去年开始使用Zabbix的时候，是1.8.X的版本，今年Zabbix已经跨入了2.0的时代。看了2.0的release notes，和performance相关的有下面几个：          :: Performance improvements::Trigger related da
  • http错误码大全 byalias http协议javaweb
    响应码由三位十进制数字组成，它们出现在由HTTP服务器发送的响应的第一行。 响应码分五种类型，由它们的第一位数字表示： 1）1xx：信息，请求收到，继续处理 2）2xx：成功，行为被成功地接受、理解和采纳 3）3xx：重定向，为了完成请求，必须进一步执行的动作 4）4xx：客户端错误，请求包含语法错误或者请求无法实现 5）5xx：服务器错误，服务器不能实现一种明显无效的请求
  • J2EE设计模式-Intercepting Filter bylijinnan java设计模式数据结构
    Intercepting Filter类似于职责链模式 有两种实现 其中一种是Filter之间没有联系，全部Filter都存放在FilterChain中，由FilterChain来有序或无序地把把所有Filter调用一遍。没有用到链表这种数据结构。示例如下： package com.ljn.filter.custom; import java.util.ArrayList;
  • 修改jboss端口 chicony jboss
    修改jboss端口   %JBOSS_HOME%\server\{服务实例名}\conf\bindingservice.beans\META-INF\bindings-jboss-beans.xml   中找到 <!-- The ports-default bindings are obtained by taking the base bindin
  • c++ 用类模版实现数组类 CrazyMizzz C++
    最近c++学到数组类，写了代码将他实现，基本具有vector类的功能 #include<iostream> #include<string> #include<cassert> using namespace std; template<class T> class Array { public: //构造函数
  • hadoop dfs.datanode.du.reserved 预留空间配置方法 daizj hadoop预留空间
    对于datanode配置预留空间的方法 为：在hdfs-site.xml添加如下配置  <property>     <name>dfs.datanode.du.reserved</name>     <value>10737418240</value>    
  • mysql远程访问的设置 dcj3sjt126com mysql防火墙
    第一步: 激活网络设置 你需要编辑mysql配置文件my.cnf. 通常状况，my.cnf放置于在以下目录： /etc/mysql/my.cnf (Debian linux) /etc/my.cnf （Red Hat Linux/Fedora Linux) /var/db/mysql/my.cnf (FreeBSD) 然后用vi编辑my.cnf，修改内容从以下行： [mysqld] 你所需要: 1
  • ios 使用特定的popToViewController返回到相应的Controller dcj3sjt126com controller
    1、取navigationCtroller中的Controllers NSArray * ctrlArray = self.navigationController.viewControllers; 2、取出后，执行， [self.navigationController popToViewController:[ctrlArray objectAtIndex:0] animated:YES
  • Linux正则表达式和通配符的区别 eksliang 正则表达式通配符和正则表达式的区别通配符
    转载请出自出处：http://eksliang.iteye.com/blog/1976579 首先得明白二者是截然不同的 通配符只能用在shell命令中,用来处理字符串的的匹配。 判断一个命令是否为bash shell(linux 默认的shell)的内置命令 type -t commad 返回结果含义 file  表示为外部命令 alias  表示该
  • Ubuntu Mysql Install and CONF gengzg Install
    http://www.navicat.com.cn/download/navicat-for-mysql Step1: 下载Navicat ，网址：http://www.navicat.com/en/download/download.html Step2：进入下载目录，解压压缩包：tar -zxvf navicat11_mysql_en.tar.gz
  • 批处理，删除文件bat huqiji windowsdos
    @echo off ::演示：删除指定路径下指定天数之前（以文件名中包含的日期字符串为准）的文件。 ::如果演示结果无误，把del前面的echo去掉，即可实现真正删除。 ::本例假设文件名中包含的日期字符串（比如：bak-2009-12-25.log） rem 指定待删除文件的存放路径 set SrcDir=C:/Test/BatHome rem 指定天数 set DaysAgo=1
  • 跨浏览器兼容的HTML5视频音频播放器 天梯梦 html5
    HTML5的video和audio标签是用来在网页中加入视频和音频的标签，在支持html5的浏览器中不需要预先加载Adobe Flash浏览器插件就能轻松快速的播放视频和音频文件。而html5media.js可以在不支持html5的浏览器上使video和audio标签生效。   How to enable <video> and <audio> tags in
  • Bundle自定义数据传递 hm4123660 androidSerializable自定义数据传递BundleParcelable
          我们都知道Bundle可能过put****()方法添加各种基本类型的数据，Intent也可以通过putExtras(Bundle)将数据添加进去，然后通过startActivity()跳到下一下Activity的时候就把数据也传到下一个Activity了。如传递一个字符串到下一个Activity   把数据放到Intent
  • C＃：异步编程和线程的使用（.NET 4.5 ） powertoolsteam .net线程C#异步编程
    异步编程和线程处理是并发或并行编程非常重要的功能特征。为了实现异步编程，可使用线程也可以不用。将异步与线程同时讲，将有助于我们更好的理解它们的特征。 本文中涉及关键知识点 1. 异步编程 2. 线程的使用 3. 基于任务的异步模式 4. 并行编程 5. 总结 异步编程 什么是异步操作？异步操作是指某些操作能够独立运行，不依赖主流程或主其他处理流程。通常情况下，C＃程序
  • spark 查看 job history 日志 Stark_Summer 日志sparkhistoryjob
    SPARK_HOME/conf 下: spark-defaults.conf 增加如下内容 spark.eventLog.enabled true spark.eventLog.dir hdfs://master:8020/var/log/spark spark.eventLog.compress true spark-env.sh 增加如下内容 export SP
  • SSH框架搭建 wangxiukai2015eye springHibernatestruts
    MyEclipse搭建SSH框架 Struts Spring Hibernate 1、new一个web project。 2、右键项目，为项目添加Struts支持。    选择Struts2 Core Libraries -<MyEclipes-Library>      点击Finish。src目录下多了struts
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他