2017年06月_Revival_Liang

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月 02月 01月

原创 web前端开发小助手

1、css：以下是横向滚动和隐藏横向滚动条，移动端浏览器基本都是webkit内核，所以兼容性不用考虑<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javas

2017-06-27 08:49:50 927

原创 css中的rem的使用核心

(function(doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function() { var clientWidth

2017-06-13 14:24:48 770

原创 vue实现自动切换tab

{{item.title}} {{item.title}} export default { name: 'parent', data () { return { data:[ {title:'第1项'},{title:'第2项'},{title:'第3项'},{title:'第4项'},{title:'第5项'},{tit

2017-06-29 22:03:58 4690

原创 vue-cli项目导入jquery插件（其他插件类似）

（前期准备工作，npm install jquery，你懂的）1、我们需要修改的是build/webpack.base.conf.js，修改两处的代码（1）在头部引入var webpack = require('webpack')（2）在这个文件的最后写入配置即可plugins: [ new webpack.ProvidePlugin({

2017-06-29 15:33:47 854

原创 js实现点击往左移动

Document *{margin: 0px;padding: 0px;} ul{width: 10000px;height: 50px;left: 0px; position: relative; list-style: none;transition: width 0.5s;-moz-transition: left 0.5s;-webkit-transition: left 0.

2017-06-22 19:29:22 7198

原创 vue-cli之那些日子踩过的坑哈哈（或许有你想要的答案）

1，打包的时候图中的位置需要加一个点，否则打包之后会报找不到资源文件的错误，比如说找不到css文件，图中为config文件夹下的index.js文件内容2，关于绑src的问题（1）如图这样写，在本地是没有问题的，但是打包之后就会报找不到资源的错误（2）正确的做法是加上require()，如图，这样打包就没问题了

2017-06-20 14:07:29 801

原创与php后台的交互（和解决中文编码问题）

<?php header('Access-Control-Allow-Origin:*'); header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept"); header("Content-Type: charset=UTF-8");$json = array( arra

2017-06-18 07:59:20 2221

原创前端开发之调用天气api

高德接口：key自己申请哈呵呵，记住创建key的时候一定要选web服务，不是web前端，否则失败http://restapi.amap.com/v3/weather/weatherInfo?key=key&city=广州点击打开使用说明

2017-06-16 09:27:53 7030 1

原创前端使用高德小记录

浏览器定位 <script type="text/javascript" src="http://webapi.amap.com/maps?v=1.3&key=8325164e247e15eea68b59e89200988b">/***************************************由于Chrome、IOS10等已不再支持非安全域的浏览器定位请求，为保

2017-06-14 21:27:19 1179

原创自定义vue组件小集合

倒计时组件 {{str}} export default{ data(){ return { str:'', timeStamp:10 } }, created:function(){ this.downCount() }, methods:{ downCount:function(){ if(this.t

2017-06-11 13:52:11 1194

原创 element 组件使用小教程集合（element1.3.6）

轮播图： .bannerbox{width: 500px;} .el-carousel__item h3 { color: #>; font-size: 18px; opacity: 0.75; line-height: 300px; margin: 0; } .el-carou

2017-06-10 21:57:26 4126

原创前端实现图片（img）预加载

.box{width: 1000px;height: 7000px;position: relative;} .igm1,.igm2,.igm3{width: 1000px;height: 1000px;margin-bottom: 500px;} $("img").lazyload({ effect :"fadeIn", threshold

2017-06-02 15:15:47 2923

原创 element 修改主题方法

1，cnpm i element-theme -g 安装主题工具，从淘宝镜像下载快很多哦2，npm i element-theme-default -D 拉取代码3，初始化变量文件（用来修改主题颜色的，并不是主题文件，仅仅用户修改）命令是 et -i 就会在当前目录生成element-variables.css文件4，修改变量文件如：--color-pri

2017-06-01 18:08:09 6584 1

网络请求框架Volley

谷歌最近推出的网路请求框架，功能强大，使用简单，只需几行代码即可完成完成网络请求，适用于数据量不大的请求，比如加载图片，JSON，String等，具体使用方法请百度一下吧，很多教程的！

2016-08-13

解析JSON数据的gson库

这是一款出自谷歌公司的Gson库，用来解析JSON数据非常的简单，用法可以参考http://blog.csdn.net/revival_liang/article/details/51819969

2016-07-04

安卓《独立版Mat》内存分析工具

Android Studio自带的内存监控不够强大，所以我们应该选择独立版Mat来弥补这个不足，使用此工具让我们可以更好的分析内存的泄漏问题。

2016-06-20

先来看activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:swipe="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity" > <com.fortysevendeg.swipelistview.SwipeListView android:id="@+id/example_lv_list" android:layout_width="match_parent" android:layout_height="match_parent" android:listSelector="#00000000" swipe:swipeActionLeft="dismiss" swipe:swipeActionRight="reveal" swipe:swipeAnimationTime="0" swipe:swipeBackView="@+id/back" swipe:swipeCloseAllItemsWhenMoveList="true" swipe:swipeFrontView="@+id/front" swipe:swipeMode="both" swipe:swipeOffsetLeft="0dp" swipe:swipeOffsetRight="0dp" swipe:swipeOpenOnLongPress="false" /> </RelativeLayout> 这里就一个swipelistview控件，我说几个不易理解的属性表示滑动时的操作，dismiss表示滑动时删除，如果设置为reveal表示滑动时会显示出item后面的选项 swipe:swipeActionLeft=”dismiss” swipe:swipeActionRight=”reveal” 这个是背面布局的id（我们把直接看到的布局叫做前面的，滑动之后才能看到的布局叫做背面的），必须与背面布局id对应 swipe:swipeBackView=”@+id/back” 这个是滚动时候是否关闭背面的布局，true表示关闭，false表示不关闭，一般设置为true swipe:swipeCloseAllItemsWhenMoveList=”true” 这个是前面布局的id，要与布局的id对应 swipe:swipeFrontView=”@+id/front” both表示可以向左滑也可以向右滑，right和left分别表示只能向有或者向左滑动。 swipe:swipeMode=”both” 下面两个表示向左或者向右滑动时的偏移量，一般不在xml文件中设置，而是在代码中根据设置的大小来设置偏移量。 swipe:swipeOffsetLeft=”0dp” swipe:swipeOffsetRight=”0dp” 再来看看Item布局文件，这里包括前面的和后面的，两个重叠在一起： <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" >  <LinearLayout android:id="@+id/back" android:layout_width="match_parent" android:layout_height="80dp" android:background="#eee" android:tag="back" > <Button android:id="@+id/example_row_b_action_1" android:layout_width="0dp" android:layout_height="60dp" android:layout_gravity="center" android:layout_marginRight="10dp" android:layout_weight="1" android:text="测试" /> <Button android:id="@+id/example_row_b_action_2" android:layout_width="0dp" android:layout_height="60dp" android:layout_gravity="center" android:layout_marginLeft="10dp" android:layout_weight="1" android:text="删除" /> <Button android:id="@+id/example_row_b_action_3" android:layout_width="0dp" android:layout_height="60dp" android:layout_gravity="center" android:layout_weight="1" android:text="编辑" /> </LinearLayout>  <RelativeLayout android:id="@+id/front" android:layout_width="match_parent" android:layout_height="80dp" android:background="#ffffff" android:orientation="vertical" android:tag="front" > <TextView android:id="@+id/example_row_tv_title" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_centerInParent="true" android:textSize="18sp" /> </RelativeLayout> </FrameLayout> 这个布局是一个常规布局，我就不解释了。 MainActivity.Java，关键地方都有注释 public class MainActivity extends Activity { private SwipeListView mSwipeListView ; private SwipeAdapter mAdapter ; public static int deviceWidth ; private List<String> testData ; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mSwipeListView = (SwipeListView) findViewById(R.id.example_lv_list); testData = getTestData(); //数据适配 mAdapter = new SwipeAdapter(this, R.layout.package_row, testData,mSwipeListView); //拿到设备宽度 deviceWidth = getDeviceWidth(); mSwipeListView.setAdapter(mAdapter); //设置事件监听 mSwipeListView.setSwipeListViewListener( new TestBaseSwipeListViewListener()); reload(); } private List<String> getTestData() { String [] obj = new String[]{"红楼梦","西游记","水浒传","管锥编","宋诗选注","三国演义","android开发高级编程","红楼梦","西游记","水浒传","管锥编","宋诗选注","三国演义","android开发高级编程"}; List<String> list = new ArrayList<String>(Arrays.asList(obj)); return list; } private int getDeviceWidth() { return getResources().getDisplayMetrics().widthPixels; } private void reload() { // mSwipeListView.setSwipeMode(SwipeListView.SWIPE_MODE_LEFT); // mSwipeListView.setSwipeActionLeft(SwipeListView.SWIPE_ACTION_REVEAL); // mSwipeListView.setSwipeActionRight(settings.getSwipeActionRight()); //滑动时向左偏移量，根据设备的大小来决定偏移量的大小 mSwipeListView.setOffsetLeft(deviceWidth * 1 / 3); mSwipeListView.setOffsetRight(deviceWidth * 1 / 3); // mSwipeListView.setOffsetRight(convertDpToPixel(settings.getSwipeOffsetRight())); //设置动画时间 mSwipeListView.setAnimationTime(30); mSwipeListView.setSwipeOpenOnLongPress(false); } class TestBaseSwipeListViewListener extends BaseSwipeListViewListener{ //点击每一项的响应事件 @Override public void onClickFrontView(int position) { super.onClickFrontView(position); Toast.makeText(getApplicationContext(), testData.get(position), Toast.LENGTH_SHORT).show(); } //关闭事件 @Override public void onDismiss(int[] reverseSortedPositions) { for (int position : reverseSortedPositions) { Log.i("lenve", "position--:"+position); testData.remove(position); } mAdapter.notifyDataSetChanged(); } } } 数据适配器： public class SwipeAdapter extends ArrayAdapter<String> { private LayoutInflater mInflater ; private List<String> objects ; private SwipeListView mSwipeListView ; public SwipeAdapter(Context context, int textViewResourceId,List<String> objects, SwipeListView mSwipeListView) { super(context, textViewResourceId, objects); this.objects = objects ; this.mSwipeListView = mSwipeListView ; mInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); } @Override public View getView(final int position, View convertView, ViewGroup parent) { ViewHolder holder = null ; if(convertView == null){ convertView = mInflater.inflate(R.layout.package_row, parent, false); holder = new ViewHolder(); holder.mFrontText = (TextView) convertView.findViewById(R.id.example_row_tv_title); holder.mBackEdit = (Button) convertView.findViewById(R.id.example_row_b_action_3); holder.mBackDelete = (Button) convertView.findViewById(R.id.example_row_b_action_2); convertView.setTag(holder); }else{ holder = (ViewHolder) convertView.getTag(); } holder.mBackDelete.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { //关闭动画 mSwipeListView.closeAnimate(position); //调用dismiss方法删除该项（这个方法在MainActivity中） mSwipeListView.dismiss(position); } }); String item = getItem(position); holder.mFrontText.setText(item); return convertView; } class ViewHolder{ TextView mFrontText ; Button mBackEdit,mBackDelete ; } } 以上就是SwipeListViewTest的用法，希望对你有帮助

2016-05-23

BadgeView提示图标

2016-05-06

SwipeListView