Android开发之用户头像上传

一,概述

本篇博客总结一下自己在开发过程中应用到的一些知识,在本篇博客中带领大家完成用户头像选择或者拍照上传,并对图片进行大小的压缩,和形状的控制,可以将用户选择到的图片裁剪成圆形上传。

ok,我们开始写一个小的demo,完成用户圆形头像的选取,在写即将实现的效果之前我们看一下即将要实现的效果图

这里写图片描述

二,实现代码

activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center_horizontal"
    android:orientation="vertical" >

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#51CA65"
        android:padding="30dp" >

        <ImageView
            android:id="@+id/iv_personal_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@drawable/default_personal_image" />
    </RelativeLayout>

    <Button
        android:id="@+id/btn_change"
        android:layout_marginTop="6dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="修改头像" >
    </Button>

</LinearLayout>
MainActivity.java
package com.example.uploadpicdemo;

import java.io.File;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.Intent;
import android.graphics.Bitmap;
import android.net.Uri;
import android.os.Bundle;
import android.os.Environment;
import android.provider.MediaStore;
import android.util.Log;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends Activity {

    protected static final int CHOOSE_PICTURE = 0;
    protected static final int TAKE_PICTURE = 1;
    private static final int CROP_SMALL_PICTURE = 2;
    protected static Uri tempUri;
    private ImageView iv_personal_icon;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button btn_change = (Button) findViewById(R.id.btn_change);
        iv_personal_icon = (ImageView) findViewById(R.id.iv_personal_icon);
        btn_change.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                showChoosePicDialog();
            }
        });
    }

    /**
     * 显示修改头像的对话框
     */
    protected void showChoosePicDialog() {
        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        builder.setTitle("设置头像");
        String[] items = { "选择本地照片", "拍照" };
        builder.setNegativeButton("取消", null);
        builder.setItems(items, new DialogInterface.OnClickListener() {

            @Override
            public void onClick(DialogInterface dialog, int which) {
                switch (which) {
                case CHOOSE_PICTURE: // 选择本地照片
                    Intent openAlbumIntent = new Intent(
                            Intent.ACTION_GET_CONTENT);
                    openAlbumIntent.setType("image/*");
                    startActivityForResult(openAlbumIntent, CHOOSE_PICTURE);
                    break;
                case TAKE_PICTURE: // 拍照
                    Intent openCameraIntent = new Intent(
                            MediaStore.ACTION_IMAGE_CAPTURE);
                    tempUri = Uri.fromFile(new File(Environment
                            .getExternalStorageDirectory(), "image.jpg"));
                    // 指定照片保存路径(SD卡),image.jpg为一个临时文件,每次拍照后这个图片都会被替换
                    openCameraIntent.putExtra(MediaStore.EXTRA_OUTPUT, tempUri);
                    startActivityForResult(openCameraIntent, TAKE_PICTURE);
                    break;
                }
            }
        });
        builder.create().show();
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (resultCode == RESULT_OK) { // 如果返回码是可以用的
            switch (requestCode) {
            case TAKE_PICTURE:
                startPhotoZoom(tempUri); // 开始对图片进行裁剪处理
                break;
            case CHOOSE_PICTURE:
                startPhotoZoom(data.getData()); // 开始对图片进行裁剪处理
                break;
            case CROP_SMALL_PICTURE:
                if (data != null) {
                    setImageToView(data); // 让刚才选择裁剪得到的图片显示在界面上
                }
                break;
            }
        }
    }

    /**
     * 裁剪图片方法实现
     * 
     * @param uri
     */
    protected void startPhotoZoom(Uri uri) {
        if (uri == null) {
            Log.i("tag", "The uri is not exist.");
        }
        tempUri = uri;
        Intent intent = new Intent("com.android.camera.action.CROP");
        intent.setDataAndType(uri, "image/*");
        // 设置裁剪
        intent.putExtra("crop", "true");
        // aspectX aspectY 是宽高的比例
        intent.putExtra("aspectX", 1);
        intent.putExtra("aspectY", 1);
        // outputX outputY 是裁剪图片宽高
        intent.putExtra("outputX", 150);
        intent.putExtra("outputY", 150);
        intent.putExtra("return-data", true);
        startActivityForResult(intent, CROP_SMALL_PICTURE);
    }

    /**
     * 保存裁剪之后的图片数据
     * 
     * @param
     * 
     * @param picdata
     */
    protected void setImageToView(Intent data) {
        Bundle extras = data.getExtras();
        if (extras != null) {
            Bitmap photo = extras.getParcelable("data");
            photo = Utils.toRoundBitmap(photo, tempUri); // 这个时候的图片已经被处理成圆形的了
            iv_personal_icon.setImageBitmap(photo);
            uploadPic(photo);
        }
    }

    private void uploadPic(Bitmap bitmap) {
        // 上传至服务器
        // ... 可以在这里把Bitmap转换成file,然后得到file的url,做文件上传操作
        // 注意这里得到的图片已经是圆形图片了
        // bitmap是没有做个圆形处理的,但已经被裁剪了

        String imagePath = Utils.savePhoto(bitmap, Environment
                .getExternalStorageDirectory().getAbsolutePath(), String
                .valueOf(System.currentTimeMillis()));
        Log.e("imagePath", imagePath+"");
        if(imagePath != null){
            // 拿着imagePath上传了
            // ...
        }
    }
}
ok,大功告成,最后别忘了在清单文件中添加读写sd可权限,不然得不到imagePath
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
关于上面的隐示intent如果有什么不懂的可以参考

http://blog.csdn.net/ydxlt/article/details/47983661

关于startActivityForResult启动activity返回结果,在一个activity需要启动另外一个Activity得到数据的时候,我们可以通过意图启动那个Activity返回数据,然后重写Activity的onActivityResult(int requestCode, int resultCode, Intent data)方法,在里面根据我们启动的时候传入的请求码(requestCode)判断是启动的哪个Activity返回了,然后在从data参数中取得返回的数据信息,在此之前我们得判断一下启动作为结果返回的Activity的状态,也就是判断一下resultCode是运行的时候被取消了还是运行正常,还是其他情况(RESULT_FIRST_USER),如果resultCode返回RESULT_OK表示用户在启动的Activity中选择了数据,这个时候我们可以从data中去掉相应的信息了,如果resultCode返回RESULT_CANCELED者没必要处理数据了因为用户没在启动的activity中做任何操作就返回了
在一个activity中可以多次通过startActivityForResult启动其他Activity得到数据。

eclipse demo下载地址:http://download.csdn.net/detail/ydxlt/9053973

Android Studio Demo clone地址(新):https://github.com/ydxlt/UploadPicDemo.git

  • 23
    点赞
  • 101
    收藏
    觉得还不错? 一键收藏
  • 55
    评论
### 回答1: 感谢您的提问。uniapp上传头像开发流程如下: 1. 在uniapp中使用uni.uploadFile()方法上传头像文件到服务器。 2. 服务器接收到上传的文件后,将文件保存到指定的目录中。 3. 服务器返回上传成功的信息给客户端。 4. 客户端根据服务器返回的信息,更新用户头像信息。 希望以上回答能够帮助您。 ### 回答2: uniapp上传头像开发流程如下: 1. 创建uniapp项目:首先,需要在开发环境下创建一个uniapp项目。 2. 配置文件路径:在项目的`manifest.json`文件中,配置相应的权限,包括写入外部存储的权限和相机/相册的权限。 3. 创建页面:在项目中创建一个页面,用于实现上传头像的功能。可以通过`uni-upload`组件实现上传功能。 4. 调用相机/相册:在页面中,可以使用`uni.chooseImage`方法调用相机或相册,选择要上传头像图片。 5. 图片预览:选择图片后,可以使用`uni.previewImage`方法进行图片预览,确保选择的图片正确。 6. 图片上传:通过`uni.uploadFile`方法将选择的图片文件上传到服务器,并获取返回的图片地址。 7. 头像显示:将上传成功后的图片地址保存在本地,并在页面中显示头像。可以使用`<image>`组件来展示图片。 需要注意的是,除了以上步骤外,还需要进行一些额外的工作。比如,处理图片的压缩、裁剪等操作,以减少图片的大小和提高用户体验。此外,还需要在服务器端进行相应的接口开发,用于接收和处理上传头像文件。 总结起来,uniapp上传头像开发流程主要包括项目创建、配置文件路径、页面创建、调用相机/相册、图片预览、图片上传头像显示。通过这些步骤,可以实现头像上传功能并在页面中显示上传头像。 ### 回答3: uniapp 是一种跨平台的开发框架,可以同时开发 iOS、Android 和 Web 等多个平台的应用。下面是 uniapp 开发头像上传的流程: 1. 准备工作:首先,需要在 uniapp 的项目中引入头像上传所需的组件和插件,如uni-ui和wx.uploadFile。 2. 样式设计:设计一个头像上传按钮,并设置好按钮的样式。 3. 点击事件:为头像上传按钮添加一个点击事件,在该事件中可以调用 uniapp 提供的 API 获取用户选择的图片。 4. 图片处理:获取到用户选择的图片后,可以进行一些图片处理操作,如裁剪、压缩等。 5. 上传操作:将处理后的图片通过 wx.uploadFile 接口上传至服务器。需要注意的是,需要先获取到服务器的上传地址和 token 等信息用于上传。 6. 上传状态监听:监听上传的状态,可根据返回的结果判断上传是否成功,并进行相应的处理。 7. 保存头像信息:如果上传成功,可以将服务器返回的头像地址保存到本地或发送给后端进行保存。 8. 显示头像:将上传成功的头像地址用于显示用户头像。 9. 错误处理:对于上传过程中可能出现的错误,需要进行相应的错误处理,如进行提示、日志记录等。 10. 兼容性处理:由于 uniapp 是一个跨平台的框架,需要考虑不同平台上头像上传的兼容性,如处理图片的格式、大小限制等。 以上就是 uniapp 实现头像上传功能的开发流程。通过这个流程,可以实现用户在 uniapp 应用中上传头像的功能,并将上传头像保存至服务器用于显示。
评论 55
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值