CI框架学习之七 ( 常用图像处理 封装 )

     其实微信手机端上图时,列表图最好是缩略图,节省流量,这不,又被移动坑了一把,话费签一分就停机,流量欠到90块才停机,我也是醉了。。。

     不说废话了,下面是CI 的内置处理图像的库写的,小弟不才,遗漏之处敬请指出,谢谢。

/**
	 * 生成缩略图
	 * @param   $path 原图的本地路径
	 * @return  null 创建一个 原图_thumb.扩展名 的文件
	 *
	 */
	public function dealthumb($path){

		$config['image_library'] = 'gd2';
		$config['source_image'] = $path;
		$config['create_thumb'] = TRUE;
		//生成的缩略图将在保持纵横比例 在宽度和高度上接近所设定的width和height
		$config['maintain_ratio'] = TRUE;
		$config['width'] = 80;
		$config['height'] = 80;

		$this->load->library('image_lib', $config);

		$this->image_lib->resize();
		$this->image_lib->clear();

	}

	/*
	 * 处理图像旋转
     */
	public function transroate($path,$imgpath){

		$this->load->library('image_lib');
		//(必须)设置图像库
        $config['image_library'] = 'gd2';

        $newname = time().'_rote.jpg';
        //设置图像的目标名/路径
        $config['new_image'] =$imgpath.$newname;
        //(必须)设置原始图像的名字/路径
        $config['source_image'] = $path;
        //决定新图像的生成是要写入硬盘还是动态的存在
        $config['dynamic_output'] = FALSE;
        //设置图像的品质。品质越高,图像文件越大
        $config['quality'] = '90%';
        //有5个旋转选项 逆时针90 180 270 度 vrt 竖向翻转 hor 横向翻转
        $config['rotation_angle'] = 'vrt';

        $this->image_lib->initialize($config);

        if(@$this->image_lib->rotate()){
			$this->image_lib->clear();
			return $config['new_image'];
		}else{
			$this->image_lib->clear();
			return '';
		}
	}

	/**
	 * 处理图像水印
	 */
	public function overlay($path,$imgpath){

        $this->load->library('image_lib');
        $newname = time().'_over.jpg';
        //设置新图像名称
        $config['new_image'] =$imgpath.$newname;
        //调用php gd库 绘图
        $config['image_library'] = 'gd2';
        //源图像 本地地址
		$config['source_image'] = $path;
		//覆盖文字
		$config['wm_text'] = 'Copyright 2015 - Friker';
		//覆盖类型 文字/图像
		$config['wm_type'] = 'text';
		//文字字体类型
		//$config['wm_font_path'] = 'C:\Windows\Fonts\vrinda.ttf';
		//字体大小
		$config['wm_font_size'] = '16';
		//字体颜色
		$config['wm_font_color'] = 'ff0000';
		//垂直方向距离顶端距离
		$config['wm_vrt_alignment'] = '20';
		//水平方向距离左端距离
		$config['wm_hor_alignment'] = 'center';
		//padding
		$config['wm_padding'] = '20';

		$this->image_lib->initialize($config);

		if($this->image_lib->watermark()){
			$this->image_lib->clear();
			return $config['new_image'];
		}else{
			$this->image_lib->clear();
			return '';
		}
	}

	 /**
      *   处理图片上传
      *   文件上传类 通过前台 上传文件
      */

	public function uploadfile(){
		//文件上传部分
		// 处理文件
        // $data = '';
		$this->load->helper('url');
		$formpic = key($_FILES);
		//文件处理部分
        if(false === empty($_FILES[$formpic]['tmp_name'])){
            //设置文件上传的路径
            $upload['upload_path'] = "./public/img/";
            //限制文件上传的类型
            $upload['allowed_types'] = 'jpeg|jpg|gif|png';
            //限制文件上传的大小
            $upload['max_size'] = 2048;
            //设置文件上传的路径
            $upload['file_name'] = date('YmdHis', time()).rand(10000, 99999);

            //加载文件上传配置信息
            $this->load->library('upload', $upload);
            //处理文件上传
            $this->upload->do_upload($formpic);

            //返回文件上传信息
            $image = $this->upload->data();
            /*
              'file_name' => string '2015071702051718388.jpg' (length=23)
			  'file_type' => string 'image/jpeg' (length=10)
			  'file_path' => string 'E:/wamp/www/testci/public/img/' (length=30)
			  'full_path' => string 'E:/wamp/www/testci/public/img/2015071702051718388.jpg' (length=53)
			  'raw_name' => string '2015071702051718388' (length=19)
			  'orig_name' => string '2015071702051718388.jpg' (length=23)
			  'client_name' => string 'u=415761610,1548338330&fm=116&gp=0.jpg' (length=38)
			  'file_ext' => string '.jpg' (length=4)
			  'file_size' => float 3.74
			  'is_image' => boolean true
			  'image_width' => int 146
			  'image_height' => int 220
			  'image_type' => string 'jpeg' (length=4)
			  'image_size_str' => string 'width="146" height="220"' (length=24)
             */
            //var_dump($image);
            //返回文件上传名字
            $data = $image['file_name'];
            $this->dealthumb($image['full_path']);
            $this->overlay($image['full_path'],$image['file_path']);
            $this->transroate($image['full_path'],$image['file_path']);//

            $thumbdata = '';
            //生成缩略图名称
            $pos = strripos($image['file_name'], ".");
            $newname = substr($image['file_name'], 0,$pos)."_thumb".substr($image['file_name'], $pos);
            if(file_exists($image['file_path'].$newname)){
            	$thumbdata = $newname;
            }
        }

        //$dirroot = $_SERVER['DOCUMENT_ROOT'];
        //$this->dealthumb($dirroot."/public/img/".$data);

		//上传失败
		if(!$data){
		    echo json_encode(array('status'=>0,'msg'=>"上传失败!"));
		}else{
		//上传成功
	        echo json_encode(array(
    	        'name'=>$data,
    	        'pic'=>base_url()."public/img/".$data,
    	        'picthumb'=>$thumbdata == '' ?$data:$thumbdata
    	        ));
	    }
	}

下面是前端的基本html代码:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/public/stylesheets/bootstrap.min.css" />
<link rel="stylesheet" href="/public/stylesheets/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="/public/stylesheets/matrix-style.css" />
<link rel="stylesheet" href="/public/stylesheets/matrix-media.css" />

<script type="text/javascript" src="/public/javascripts/jquery.min.js"></script>
<script type="text/javascript" src="/public/javascripts/jquery.form.js"></script>
<script type="text/javascript" src="/public/javascripts/jquery.validate.js"></script>

<style type="text/css">
body{background:#eeeeee; margin:0px;}
</style>
</head>

<body>


<div class="control-group">
	<label class="control-label"> 分享logo: </label>
	<div class="controls">
		 <input type="file" name="sharepic" id="sharepic"/>
		 <input type="hidden" name="act_sharepic" value="" id="act_sharepic"/>(<sapn class="fred">最佳大小为 80 X 80 像素</sapn>)
		 <p style="margin:20px 0;"><img src="/public/img/default.png" alt="" id="sharepic_img"></p>
	</div>
</div>


<script type="text/javascript">
$(function () {
	
	/*****************图片上传部分开始 *******************/
	var act = "<form class='myupload' action='"+"<?php echo site_url('mytest/uploadfile');?>"+"' method='post' enctype='multipart/form-data'></form>";

    $("#sharepic").change(function(){
        $(this).wrap(act);
        $(this).parent(".myupload").ajaxSubmit({
            dataType:  'json',
            success: function(data) {
                var src = data.pic;
                //更改预览图像地址
                $('#sharepic_img').attr("src",src);
                $('#act_sharepic').val(data.name);
                $('#sharepic').unwrap();
            },
            error:function(xhr){
                alert(JSON.parse(xhr));
            }
        });
    });

})
</script>
</body>
</html>




  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值