RxImagePicker

English Documentation | 中文文档

<p/>

<a target="_blank" href="https://bintray.com/mq2553299/maven/rximagepicker"><img src="https://api.bintray.com/packages/mq2553299/maven/rximagepicker/images/download.svg?version=3.0.0-beta02"></a>(RxJava3) <a target="_blank" href='https://bintray.com/mq2553299/maven/rximagepicker/2.5.4/link'><img src='https://api.bintray.com/packages/mq2553299/maven/rximagepicker/images/download.svg?version=2.5.4'></a>(RxJava2) <a target="_blank"><img src="https://img.shields.io/badge/API-16+-green.svg"></a> <a target="_blank" href="https://github.com/qingmei2/RxImagePicker/blob/2.x/LICENSE"><img src="https://img.shields.io/badge/License-MIT-blue.svg"></a>

Support for RxJava2. Flexible picture selector of Android, provides the support for theme of Zhihu and WeChat.

Zhihu: Famous Online Q&A Community APP in China.
WeChat: Most Used Instant Messaging Social Networking App in China.

Introduction

Purpose of RxImagePicker: Let developers realize the demand of selecting picture in the development of Android in a simple and flexible way.

RxImagePicker is a reactive picture selector for Android, which converts your selection requirements of picture into an interface for configuration and displays any UI theme in Activity or Fragment.

Support

• [x] Android Camera Photograph
• [x] Android photo album picture selection
• [x] Returns data in the format of reactive data stream ( such as Observable/Flowable/Single/Maybe )
• [x] AndroidX support ( after v2.3.0 )

Support of UI

• [x] System Picture Selector
• [x] [Optional] Theme Picture Selector of Zhihu
• [x] [Optional] Theme Picture Selector of WeChat ()
• [x] [Optional] Custom UI Picture Selector

Screenshots

Selection and result display of system picture:

<div align:left;display:inline;> <img width="200" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/screenshot_sysytem.png"/> <img width="200" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/screenshot_result.png"/> </div>

Theme of Zhihu

<div align:left;display:inline;> <img width="200" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/screenshot_zhihu_dracula.png"/> <img width="200" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/screenshot_zhihu_normal.png"/> </div>

Theme of WeChat

<div align:left;display:inline;> <img width="200" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/screenshot_wechat.png"/> <img width="200" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/screenshot_wechat_expand.png"/> </div>

UI Test

<div align:left;display:inline;> <img width="235" height="360" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/rximagepicker_test.gif"/> </div> <div align:left;display:inline;> <img width="608" height="175" src="https://github.com/qingmei2/RxImagePicker/blob/2.x/screenshot/test_result.png"/> </div>

Basic Usage

The following code will show you how to use photo album or camera at the Android system-level :

1.Add the following depending on the file of build.gradle:

// The most basic architecture, only provides the default
// picture selector and photographing function of system.

implementation 'com.github.qingmei2:rximagepicker:${last_version}'

// Provide the basic components of custom UI picture selector
// and this dependency needs to be added to the requirements of the custom UI
implementation 'com.github.qingmei2:rximagepicker_support:${last_version}'


// If you need additional UI support, choose to rely on the corresponding UI extension library

// Zhihu picture selector
implementation 'com.github.qingmei2:rximagepicker_support_zhihu:${last_version}'

// WeChat picture selector
implementation 'com.github.qingmei2:rximagepicker_support_wechat:${last_version}'

If your project not migrate to androidx, please use version 2.2.0.

2.Interface Configuration

Declare an interface and carry out the following configuration:

public interface MyImagePicker {

    @Gallery    // open gallery
    Observable<Result> openGallery(Context context);

    @Camera     // take photos
    Observable<Result> openCamera(Context context);
}

3.Instantiate and use it

Instantiate the interface in your Activity or Fragment to open the default album and camera screen of system:

RxImagePicker
        .create(MyImagePicker.class)
        .openGallery(this)
        .subscribe(new Consumer<Result>() {
            @Override
            public void accept(Result result) throws Exception {
                // do something, ex:
                Uri uri = result.getUri();
                GlideApp.with(this)
                         .load(uri)
                         .into(ivPickedImage);
            }
        });

Support UI theme Usage

1.Add the following depending on the file of build.gradle:

// Zhihu picture selector
implementation 'com.github.qingmei2:rximagepicker_support_zhihu:${last_version}'

2.Interface Configuration

Declare an interface and carry out the following configuration:

interface ZhihuImagePicker {

    // normal style
    @Gallery(componentClazz = ZhihuImagePickerActivity::class,
            openAsFragment = false)
    fun openGalleryAsNormal(context: Context,
                            config: ICustomPickerConfiguration): Observable<Result>

    // dracula style                        
    @Gallery(componentClazz = ZhihuImagePickerActivity::class,
            openAsFragment = false)
    fun openGalleryAsDracula(context: Context,
                             config: ICustomPickerConfiguration): Observable<Result>

    // take photo                         
    @Camera
    fun openCamera(context: Context): Observable<Result>
}

3.Instantiate and use it

val rxImagePicker: ZhihuImagePicker = RxImagePicker
                .create(ZhihuImagePicker::class.java)

rxImagePicker.openGalleryAsNormal(this,
                ZhihuConfigurationBuilder(MimeType.ofImage(), false)
                        .maxSelectable(9)
                        .countable(true)
                        .spanCount(4)
                        .theme(R.style.Zhihu_Normal)
                        .build())
               .subscribe {
                    Glide.with(this@ZhihuActivity)
                            .load(it.uri)
                            .into(imageView)
                }

see sample for more informations.

Advanced Usage

1. Action Annotation

RxImagePicker provides two action annovation, respectively @Gallery and @Camera.

@Camera will declare the way annovated by the annovation Open the camera to take a photo.

Please note, each method of the interface must add an action annotation to declare the corresponding action. If the method is not configured with @Gallery or @Camera, RxImagePicker will throw an Exception at runtime.

@Gallery

@Gallery will open the photo album to choose picture.

It has three parameters:

• componentClazz：KClass<*> The class object of UI component, opens SystemGalleryPickerView::class—— the system Gallery by default.

• openAsFragment：Boolean Whether UI component is displayed as Fragment in some parts of Activity is true by default.

• containerViewId: Int If UI needs to be displayed as Fragment in ViewGroup, the id corresponding to the ViewGroup needs to be assigned to it.

At present UI component only supports two kinds: FragmentActivity or Fragment(support-v4).

Taking turning on the system camera for example, its principle is to instantiate an invisible Fragment in the current Activity, and Fragment opens the system photo album through Intent and processes the returned data through the method of onActivityResult(). The code is as the following:

interface SystemImagePicker {

    @Gallery   // by default,componentClazz：KClass = SystemGalleryPickerView::class，openAsFragment：Boolean=true
    fun openGallery(context: Context): Observable<Result>
}

When need to custom UI, taking Zhihu theme as an example, we will configure ZhihuImagePickerActivity::class to componentClazz and set the value of openAsFragment to false:

interface ZhihuImagePicker {

    @Gallery(componentClazz = ZhihuImagePickerActivity::class,
            openAsFragment = false)
    fun openGalleryAsNormal(context: Context,
                            config: ICustomPickerConfiguration): Observable<Result>

    @Gallery(componentClazz = ZhihuImagePickerActivity::class,
            openAsFragment = false)
    fun openGalleryAsDracula(context: Context,
                             config: ICustomPickerConfiguration): Observable<Result>

    @Camera
    fun openCamera(context: Context): Observable<Result>
}

For more information, please refer to the ZhihuActivity in sample.

At the same time, when UI needs to be displayed as Fragment, RxImagePicker needs to be informed of the id of the ViewGroup control so that RxImagePicker can be correctly displayed in the corresponding ViewGroup.

@Camera

@Camera will declare the way annotated by the annotation open the camera to take photo.

Please note, @Camera only provides the function of calling the system camera to take a photo at present. Although this annotation provides the same API as @Gallery, there is no sense to configure them at present.

2.ICustomPickerView

`ICu