Skip to content Skip to sidebar Skip to footer

Possibility Of A Curved Gallery

Is it possible to change the default arrangement of the Android Gallery? What i meant is can we make the Gallery in a curved path, where the images will be along the curved path an

Solution 1:

Extend Gallery and override drawChild.

drawChild will be called for each child that needs to be drawn.

protected boolean drawChild(Canvas canvas, View child, long drawingTime){

    finalint left = child.getLeft();

    int adjustedXOrigin = left - (getWidth() / 2) + (child.getWidth()/2);

    int newtop = (int) (ellipseYOffset - Math.sqrt( ellipseMinor2 * (1 - ((Math.pow(adjustedXOrigin, 2)) / ellipseMajor2))));
    newtop -= (child.getHeight() / 2);

    if( newtop >= 0 )
    {
        child.layout(left, newtop, left + child.getWidth(), newtop + child.getHeight());
        return super.drawChild(canvas, child, drawingTime);
    }

    returntrue;
}

In onLayout I calculate ellipseYOffset. This centers the middle selected view vertically in the view, no matter the ellipse size.

ellipseYOffset = getMeasuredHeight() + (ellipseMinor - (getMeasuredHeight() / 2));

The "if (newtop >= 0 )" part is because the view were randomly getting drawn in weird places. This stopped that.

Edit: full code

There is some animation stuff you don't need, i just copied and pasted my class.

publicclassCarouselextendsGallery {

privatestaticfinalfloatINITIAL_MINOR_RATIO=0.75f;
privatestaticfinalfloatINITIAL_MAJOR_RATIO=1.0f;

privateint mEllipseMajor;
privateint mEllipseMinor;
privateint mEllipseMajor2;
privateint mEllipseMinor2;
privateint mEllipseYOffset;

private Animation mGalleryAlphaOut;
private Animation mGalleryAlphaIn;

private OnAnimationEndListener mFadeInEndListener;
private OnAnimationEndListener mFadeOutEndListener;

privatebooleanmCustomEllipseDim=false;

privatebooleanmInfinite=true;

privateintmXOff=0;

privateAnimationListenermFadeInAnimationListener=newAnimationListener() {
    publicvoidonAnimationStart(Animation animation) {}
    publicvoidonAnimationRepeat(Animation animation) {}
    publicvoidonAnimationEnd(Animation animation) {
        if( mFadeInEndListener != null )
        {
            mFadeInEndListener.onAnimationEnd();
        }
    }
};

privateAnimationListenermFadeOutAnimationListener=newAnimationListener() {
    publicvoidonAnimationStart(Animation animation) {}
    publicvoidonAnimationRepeat(Animation animation) {}
    publicvoidonAnimationEnd(Animation animation) {
        if( mFadeOutEndListener != null )
        {
            mFadeOutEndListener.onAnimationEnd();
        }
    }
};

publicCarousel(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    init();
}

publicCarousel(Context context, AttributeSet attrs) {
    super(context, attrs);
    init();
}

publicCarousel(Context context) {
    super(context);
    init();
}

privatevoidinit()
{
    setHorizontalFadingEdgeEnabled(false);
    setCallbackDuringFling(true);
    setUnselectedAlpha(1.0f);
    setHapticFeedbackEnabled(false);

    intdur= getResources().getInteger(R.integer.transition_dur);

    mGalleryAlphaOut = AnimationUtils.loadAnimation(getContext(), android.R.anim.fade_out);
    mGalleryAlphaOut.setFillAfter(true);
    mGalleryAlphaOut.setDuration(dur);
    mGalleryAlphaOut.setAnimationListener(mFadeOutAnimationListener);
    mGalleryAlphaIn = AnimationUtils.loadAnimation(getContext(), android.R.anim.fade_in);
    mGalleryAlphaIn.setFillAfter(true);
    mGalleryAlphaIn.setDuration(dur);
    mGalleryAlphaIn.setAnimationListener(mFadeInAnimationListener);
}

publicintgetEllipseMajor() {
    return mEllipseMajor;
}

publicvoidsetEllipseMajor(int ellipseMajor) {
    if( ellipseMajor == 0 )
    {
        mCustomEllipseDim = false;
    }
    this.mEllipseMajor = ellipseMajor;
}

publicintgetEllipseMinor() {
    return mEllipseMinor;
}

publicvoidsetEllipseMinor(int ellipseMinor) {
    if( ellipseMinor == 0 )
    {
        mCustomEllipseDim = false;
    }
    this.mEllipseMinor = ellipseMinor;
}

@OverrideprotectedbooleandrawChild(Canvas canvas, View child, long drawingTime) {
    finalintleft= child.getLeft();
    finalintchildWidth= child.getWidth();
    finalintchildHeight= child.getHeight();

    intadjustedXOrigin= left - mXOff + (childWidth>>1);

    intnewtop= (int) (mEllipseYOffset - Math.sqrt( mEllipseMinor2 * (1 - ((Math.pow(adjustedXOrigin, 2)) / mEllipseMajor2))));
    newtop -= (childHeight>>1);

    if( newtop >= 0 )
    {
        child.layout(left, newtop, left + childWidth, newtop + childHeight);
        returnsuper.drawChild(canvas, child, drawingTime);
    }
    returntrue;
}
@OverrideprotectedvoidonLayout(boolean changed, int l, int t, int r, int b) {
    super.onLayout(changed, l, t, r, b);
    if( !mCustomEllipseDim )
    {
        mEllipseMajor = (int) (getMeasuredWidth() * INITIAL_MAJOR_RATIO + 0.5f);
        mEllipseMinor = (int) (getMeasuredHeight() * INITIAL_MINOR_RATIO + 0.5f);
        mEllipseMajor2 = (int) Math.pow( mEllipseMajor, 2 );
        mEllipseMinor2 = (int) Math.pow( mEllipseMinor, 2 );
    }
    mEllipseYOffset = getMeasuredHeight() + (mEllipseMinor - (getMeasuredHeight() / 2));

    mXOff = (getWidth() / 2);
}

@OverridepublicvoidsetAdapter(SpinnerAdapter adapter) {
    super.setAdapter(adapter);
    if( mInfinite )
    {
        resetPosition();
    }
}

publicvoidresetPosition()
{
    intpos= Integer.MAX_VALUE / 2;
    if( getAdapter() != null && getAdapter().getClass() == CarouselAdapter.class )
    {
        intsize= ((CarouselAdapter)getAdapter()).getList().size();
        if( size > 2 )
            pos = pos - (pos % ((CarouselAdapter)getAdapter()).getList().size());
        elsepos=0;
        setSelection(pos);
    }
}

public OnAnimationEndListener getFadeInEndListener() {
    return mFadeInEndListener;
}

publicvoidsetFadeInEndListener(OnAnimationEndListener fadeInEndListener) {
    this.mFadeInEndListener = fadeInEndListener;
}

public OnAnimationEndListener getFadeOutEndListener() {
    return mFadeOutEndListener;
}

publicvoidsetFadeOutEndListener(OnAnimationEndListener fadeOutEndListener) {
    this.mFadeOutEndListener = fadeOutEndListener;
}

publicvoidfadeIn()
{
    startAnimation(mGalleryAlphaIn);
}

publicvoidfadeOut()
{
    startAnimation(mGalleryAlphaOut);
}

publicinterfaceOnAnimationEndListener
{
    publicabstractvoidonAnimationEnd();
}

//This disables the effect of a vehicle becoming focused when it is clicked.@OverridepublicbooleanonSingleTapUp(MotionEvent e) {
    if( getAdapter() != null )
    {
        if( pointToPosition((int)e.getX(), (int)e.getY()) != getSelectedItemPosition() )
            returntrue;
        elsereturnsuper.onSingleTapUp(e);
    }
    elsereturntrue;
}
}

Solution 2:

I think there is no provision provide by android to change the horizontal alignment of the gallery. Although we can make it vertical. If you want a Curved Gallery type view, I think it is possible to do from scratch

Thanks Abi

Post a Comment for "Possibility Of A Curved Gallery"