Added a Grid list

PXLPhotoRecyclerViewInGrid

this is a class that extends RecyclerView providing an PXLPhotoAdapter, PXLPhotoView and PXLPhotoViewHolder. Please check KtxGalleryGridFragment.kt for example codes in the demo app.

• you can customize most of ui elements if needed.
• you can add a header text to the list.
• you set a header to the grid list.
• you customize the height of items.
• infinite scroll is not available here.
• auto video playing is not available.

Add this to your xml

#!xml
<com.pixlee.pixleesdk.ui.widgets.list.PXLPhotoRecyclerViewInGrid
    android:id="@+id/pxlPhotoRecyclerViewInGrid"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

isLoopingVideo and soundMuted will be ignored in PXLPhotoRecyclerViewInGrid because PXLPhotoRecyclerViewInGrid does not support playing videos in the list

#!kotlin
PhotoWithImageScaleType(pxlPhoto = pxlPhoto,  //data
    imageScaleType = PXLPhotoView.ImageScaleType.CENTER_CROP, // [CENTER_CROP, FIT_CENTER]
    heightInPixel = cellSize, // the height cell size in RecyclerView
    isLoopingVideo = true,    // true: loop the video, false; play it once and stop it
    soundMuted = true        // true: muted, false: unmuted
)

Add this to your Activity or Fragment

#!kotlin
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(...)
    ...
    ...
    // you can customize color, size if you need
    pxlPhotoRecyclerViewInGrid.initiate(gridSpan = 2, // the number of cells in a row in the grid list
                    lineSpace = Space().apply {
                        lineWidthInPixel = 4.px.toInt() // space in pixel between cells
                        includingEdge = false           // true: if you want to have the space out side of the list, false: no space out side of the list  
                    },
                    listHeaderText = getTitleSpannable(), // you can add and custom a header text of the list with your spannable, and getTitleSpannable() is one example of how you can implement your spannable  
                    showingDebugView = false,
                    configuration = PXLPhotoView.Configuration().apply {
                        // Customize image size, not a video
                        pxlPhotoSize = PXLPhotoSize.ORIGINAL
                        // Customize Main TextView
                        mainTextViewStyle = TextViewStyle().apply {
                            text = "Spring\nColors"
                            size = 30.px
                            sizeUnit = TypedValue.COMPLEX_UNIT_PX
                            typeface = null
                            textPadding = TextPadding(bottom = 30.px.toInt())
                        }
                        // Customize Sub TextView
                        subTextViewStyle = null // you can hide this view by giving it null
                        // Customize Button
                        buttonStyle = PXLPhotoView.ButtonStyle().apply {
                            text = "VER AHORA"
                            size = 12.px
                            sizeUnit = TypedValue.COMPLEX_UNIT_PX
                            typeface = null
                            buttonIcon = com.pixlee.pixleesdk.R.drawable.baseline_play_arrow_white_24
                            stroke = PXLPhotoView.Stroke().apply {
                                width = 1.px.toInt()
                                color = Color.WHITE
                                radiusInPixel = 25.px
                                padding = PXLPhotoView.Padding().apply {
                                    left = 10.px.toInt()
                                    centerRight = 20.px.toInt()
                                    topBottom = 10.px.toInt()
                                }
                            }
                        }
    
                    }, onButtonClickedListener = { view, photoWithImageScaleType ->
                context?.also { ctx ->
                    // you can add your business logic here
                    Toast.makeText(ctx, "onButtonClickedListener", Toast.LENGTH_SHORT).show()
                    moveToViewer(photoWithImageScaleType)
                }
            }, onPhotoClickedListener = { view, photoWithImageScaleType ->
                context?.also { ctx ->
                    // you can add your business logic here
                    Toast.makeText(ctx, "onItemClickedListener", Toast.LENGTH_SHORT).show()
                }
            })

    pxlPhotoRecyclerViewInGrid.viewTreeObserver.addOnGlobalLayoutListener(object : ViewTreeObserver.OnGlobalLayoutListener {
        override fun onGlobalLayout() {
            try {
                if (pxlPhotoRecyclerViewInGrid == null)
                    return

                // this is to display two items at a time on the screen
                val cellHeightInPixel = pxlPhotoRecyclerViewInGrid.measuredHeight * 0.6f
                startList(cellHeightInPixel)
                pxlPhotoRecyclerViewInGrid.viewTreeObserver.removeOnGlobalLayoutListener(this)
            } catch (e: Exception) {
                e.printStackTrace()
            }

        }
})

fun startList(cellSize: Int) {
    // write codes to get photos first. Read API doc.
    // you should convert List<PXLPhoto> into List<PhotoWithImageScaleType>
    val pxlPhotos: List<PXLPhoto> = ....

    // turn the list into List<PhotoWithImageScaleType> to set ImageScaleType[CENTER_CROP, FIT_CENTER], and the cells' height size
    val list = ArrayList<PhotoWithImageScaleType>()
    pxlPhotos.forEach { pxlPhoto ->
        list.add(PhotoWithImageScaleType(pxlPhoto = pxlPhoto,
                                        imageScaleType = PXLPhotoView.ImageScaleType.CENTER_CROP,
                                        heightInPixel = cellSize,
                                        isLoopingVideo = true,
                                        soundMuted = true))
        list.add(PhotoWithImageScaleType(pxlPhoto = pxlPhoto,
                                        imageScaleType = PXLPhotoView.ImageScaleType.FIT_CENTER,
                                        heightInPixel = cellSize,
                                        isLoopingVideo = true,
                                        soundMuted = true))
    }


    // start the list UI by passing these arguments
    pxlPhotoRecyclerView.replaceList(list)

    // if you just want to use List<PXLPhoto>, you can do that by following these steps
    // alternative step 1: val photos: List<PXLPhoto> = ....
    // alternative step 2: pxlPhotoRecyclerView.replaceList(photos.toList(), PXLPhotoView.ImageScaleType.CENTER_CROP, cellSize)
}

fun getTitleSpannable(): SpannableString{
    val top = "PXLEE\nSHOPPERS"
    val tv = "\nTV"
    val total = top + tv
    val spannable = SpannableString(total)

    spannable.setSpan(AbsoluteSizeSpan(40.px.toInt()), 0, top.length, 0); // set size
    spannable.setSpan(ForegroundColorSpan(Color.BLACK), 0, top.length, 0);// set color

    total.indexOf(tv).let { tvLocatedAt ->
        spannable.setSpan(AbsoluteSizeSpan(20.px.toInt()), tvLocatedAt, tvLocatedAt + tv.length, 0); // set size
        spannable.setSpan(ForegroundColorSpan(Color.BLACK), tvLocatedAt, tvLocatedAt + tv.length, 0);// set color
    }

    return spannable
}

Renamed confusing words

Rename photo to content in documentation
Rename method names of pxlPhotoView.setPhoto(...) and pxlPhotoProductView.setPhoto(...) to .loadContent(...)

Improve UI widgets

What's new

• Fade out for a view playing the video in PXLPhotoRecyclerView is available.
• More documentation for customizing UI components like PhotoWithImageScaleType(…, soundMuted = true) and bookmark.
• the TextViews of the product's price in the PXLPhotoProductView now can be customizable.

Force product list's height to be always the same

1.4.2-rc06

Update README.md

Change how to play video

In order to prevent blinking video on onResume coming from onPause, the library now behaves differently internally. You do not need to change any of your codes.

1. play a video
2. pause it
3. resume it
4. iterate 2 and 3

Change video player library

due to many bugs of the previous video player library, we added a new video player library which is more stable.

Video Player & Kotlin.coroutines APIs

What's changed from 1.0.4-beta02

• the video player library is changed but there's no need to add the library in the app project.
• a color:Int is added to TextStyle.kt to allow the SDK users to customize the text color.

What's new compared to the previous official version, 1.0.3

• Kotlin is added: please note that Kotlin and Java can be used in a project. To differentiate Java classes and Kotlin classes, I added a keyword ktx to Kotlin classes' name
• UI components for a video player, written in Kotlin.
• API requests(Album, PDP, and Analytics) via Kotlin.coroutines: this is a similar way of Scala's Future + await in dealing with async tasks. So, there's no need to use callbacks(interface) anymore. The SDK users can just get the result from the API methods directly within a scope(Kotlin.coroutines' language feature). I added sample codes throughout the demo app.
• a new library project is added to implement VideoWidget: https://github.com/pixlee/AndroidJZVideo
• Documentation for UI components and Kotlin.coroutines APIs
• This Android SDK is now provided via a Gradle to our users. They now can use this by adding a Gradle dependency to their Gradle file in their Android projects. There is a guide for it in README.

Document (available in the main README)

• Main
• Index with Initializing SDK
• API : album/PDP
• API: Analytics for album/product
• API: Analytics for Ecommerce
• UI components

Demo

https://www.loom.com/share/37fb674d3cb348d48c3479b67a9bc2aa

Video Player & Kotlin.coroutines APIs

What's new

• Kotlin is added: please note that Kotlin and Java can be used in a project. To differentiate Java classes and Kotlin classes, I added a keyword ktx to Kotlin classes' name
• UI components for a video player, written in Kotlin.
• API requests(Album, PDP, and Analytics) via Kotlin.coroutines: this is a similar way of Scala's Future + await in dealing with async tasks. So, there's no need to use callbacks(interface) anymore. The SDK users can just get the result from the API methods directly within a scope(Kotlin.coroutines' language feature). I added sample codes throughout the demo app.
• a new library project is added to implement VideoPlayerView: https://github.com/pixlee/android-video-player
• Documentation for UI components and Kotlin.coroutines APIs
• This Android SDK is now provided via a Gradle to our users. They now can use this by adding a Gradle dependency to their Gradle file in their Android projects. There is a guide for it in README.

Document (available in the main README)

• Main
• Index with Initializing SDK
• API : album/PDP
• API: Analytics for album/product
• API: Analytics for Ecommerce
• UI components

Demo

https://www.loom.com/share/37fb674d3cb348d48c3479b67a9bc2aa

Improve Documentation

Improve Documentation

Video Player & Kotlin.coroutines APIs

This is an alpha version for Video Player and restful API development for Kotlin.coroutines.