pedrovgs / DraggablePanel

Android library used to create an awesome Android UI based on a draggable element similar to the last YouTube graphic component.
Apache License 2.0
2.99k stars 605 forks source link

List view is destroying UI of draggable pannel in sample app #17

Closed manpreetsinghsodhi closed 10 years ago

manpreetsinghsodhi commented 10 years ago

I imported your sample app and done minor changes. In framelayout i took first element as Listview(as i need to show working same as youtube app). When we minimize the vedio and i select any other element from listview then draggable pannel UI is getting distorted. I changed activity_youtube_sample.xml as following <?xml version="1.0" encoding="utf-8"?>

<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android" xmlns:draggable_panel="http://schemas.android.com/apk/res-auto" android:id="@+id/fl_container" android:layout_width="match_parent" android:layout_height="match_parent">

<!-- Movie Thumbnail -->

<ListView
        android:id="@+id/ivx_thumbnail"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        />

<!-- DraggablePanel -->

<com.github.pedrovgs.DraggablePanel
        android:id="@+id/draggable_panel"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        draggable_panel:x_scale_factor="@dimen/x_scale_factor"
        draggable_panel:y_scale_factor="@dimen/y_scale_factor"
        draggable_panel:top_fragment_height="@dimen/top_fragment_height"
        draggable_panel:top_fragment_margin_right="@dimen/top_fragment_margin"
        draggable_panel:top_fragment_margin_bottom="@dimen/top_fragment_margin"
        draggable_panel:enable_horizontal_alpha_effect="false"/>

Even i tried putting listview and draggable pannel in separate linear layout(with match parent) but still not working. And the rest of the code is as it is. I captured vedio of the error http://videobam.com/IUjYH This library is not working for me in this situation. Kindly help.

Fiddl3 commented 10 years ago

I had a similar problem with vitamio VideoView as dragView and resizeTransformer.

Solution: Move methods responsible for changing a position of seconView to layoutChange listener of dragView.

in DraggableView.mapGui()


...

    private void mapGUI(TypedArray attributes) {

        final int dragViewId = attributes.getResourceId(R.styleable.draggable_view_top_view_id, R.id.drag_view);
        final int secondViewId = attributes.getResourceId(R.styleable.draggable_view_bottom_view_id, R.id.second_view);
        dragView = findViewById(dragViewId);
        secondView = findViewById(secondViewId);

        ViewTreeObserver observer = dragView.getViewTreeObserver();
        observer.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                changeSecondViewPosition();
                changeSecondViewAlpha();
            }
        });
    }

...

and comment in: DraggableViewCallback.onViewPositionChanged()

...

    @Override
    public void onViewPositionChanged(View changedView, int left, int top, int dx, int dy) {
        draggableView.updateLastDragViewPosition(top, left);

        if (draggableView.isDragViewAtBottom()) {
            draggableView.changeDragViewViewAlpha();
        } else {
            draggableView.restoreAlpha();
            draggableView.changeDragViewScale();
            draggableView.changeDragViewPosition();
            //draggableView.changeSecondViewAlpha();
            //draggableView.changeSecondViewPosition();
            draggableView.changeBackgroundAlpha();
        }
    }
...

also there is bug in DraggableView.smoothSlideTo(float slideOffset)

        int x = (int) (slideOffset * (getWidth() - transformer.getMinWidth()));
        int y = (int) (topBound + slideOffset * getVerticalDragRange());

should be:

        int x = (int) (slideOffset * (getWidth() - transformer.getMinWidth() - transformer.getMarginRight()));
        int y = (int) (topBound + slideOffset * getVerticalDragRange());

and some in resize tranformer...

Fiddl3 commented 10 years ago

You need to create local copy of library (clone git repo), add it as module, add module dependency in grade (I'm using Android Studio), and modify java sources. In eclipse create android library project, make changes, compile and add .jar to libs, of your project.

Changes You need to make: In Class: https://github.com/pedrovgs/DraggablePanel/blob/develop/draggablepanel/src/main/java/com/github/pedrovgs/DraggableView.java#L334 modify/replace mapGUI (Copy&Paste from above answer)

and in https://github.com/pedrovgs/DraggablePanel/blob/develop/draggablepanel/src/main/java/com/github/pedrovgs/DraggableViewCallback.java#L58

add comment in line 66&67, or replace whole onViewPositionChanged() from my prev answer

Sorry for my English, I hope You'll understand now.

manpreetsinghsodhi commented 10 years ago

Hi i implemented the changes you suggested but still it is not working fine. There is a problem of rendering when i drag from top to bottom and bottom to top again and also it is taking a lot of time.

I am sending you screenshots when i drag from top to bottom device-2014-10-27-155051

And when i drag from bottom to top then it is displaying as follows device-2014-10-27-155135

So please help me

manpreetsinghsodhi commented 10 years ago

And what are changes in code should i do in resize transformer?

Fiddl3 commented 10 years ago

You using ScaleTransformer which is default (seems more smooth, but not working with vitamio)... in ScaleTransformer view position is changed by ViewHelper.

Add brake point in addOnGlobalLayoutListener you implemented, and check whether it is fired

If not, you should reverse changes and study dragView & secondView positions while dragging, and in OnLayout https://github.com/pedrovgs/DraggablePanel/blob/develop/draggablepanel/src/main/java/com/github/pedrovgs/DraggableView.java#L308

and check if positions are proper...

manpreetsinghsodhi commented 10 years ago

I implemented the library as it is in sample . Haven't changed anything other than changes you suggested. So how to resolve it now . Is there any alternate for this draggable pannel on github or anywhere else?

Fiddl3 commented 10 years ago

Can you share your code (Add whole project to Archive)? I'll take look and may be able to help.

manpreetsinghsodhi commented 10 years ago

@Fiddle3 sure .Can i have your mail id or skype id ?

Fiddl3 commented 10 years ago

mail.fiddle@gmail.com

pedrovgs commented 10 years ago

Guys I was on holidays and I couldn't comment about this issues. Sorry.

Instead of copy paste code modifications why don't you fork this project to your github and send me a pull request with your changes?

@manpreetsinghsodhi if you want some help, please upload your project to any repository and give me access. My mail is pedrovicente.gomez (at) gmail (dot) com. And I'll take a look.

Please, don't open more issues related with the same problem. I'm going to help you with this in this issue and close other issues opened by @manpreetsinghsodhi because every issue opened is related with the same problem.

Fiddl3 commented 10 years ago

I'll send pull request, but I have to test it more deeply

manpreetsinghsodhi commented 10 years ago

@pedrovgs sure !!

manpreetsinghsodhi commented 10 years ago

@pedrovgs Hi i added you as a collaborator to my repository. I uploaded the files that are causing me error. Please have a look. Issue you already know . I uploaded vedio in earlier issue as well. Looking positively for help.

pedrovgs commented 10 years ago

I'll take a look this weekend. Thanks!

Fiddl3 commented 10 years ago

@pedrovgs I tried to explore why this issue occurs, but I haven't enough time to investigate this deeply, so, for now, i use temp fix with ViewTreeObserver and it works I made some other changes in library, take look https://github.com/Fiddl3/DraggablePanel/commit/b0f253eb76adc530dc01e6ec456e41265065d4f2

I'll continue working on this when I'll have time, and send you a pull request... Maybe you'll resolve this issue earlier

pedrovgs commented 10 years ago

@Fiddl3 thanks! @manpreetsinghsodhi can you check if that version of the library is working for you?

Fiddl3 commented 10 years ago

@pedrovgs here is updated sample app that I send to @manpreetsinghsodhi last week https://github.com/Fiddl3/DraggablePanel/commit/e6f64b6798bc5e3707ed2d991344d62b4a876d85

manpreetsinghsodhi commented 10 years ago

Fiddle when vedio plays it is again cutting edges at bottom(only on vedio play). I will send you my project in android studio.

Fiddl3 commented 10 years ago

I don't have time to resolve all of your problems... especially if I don't know what is the problem...

I suppose that video aspect ratio is different than dragView aspect ratio and part of video is cutoff (at bottom), the solution for this "issue" is to change dragView height programmatically to adjust it to video height

There is more problems to solve for example, when you drag YT player the video doesn't change its dimensions. There will be many more so You should teach yourself how to resolve them.

pedrovgs commented 10 years ago

@manpreetsinghsodhi I've created a new branch with a ListView below DraggablePanel in YoutubeSampleActivity. It's working fine to me.

https://github.com/pedrovgs/DraggablePanel/tree/manpreetsinghsodhi-issue17

pedrovgs commented 10 years ago

@manpreetsinghsodhi I think I've found the bug. It's related with YouTube player view. This view is executing requestLayout when I still think my view was in other position :) I've changed onLayout method to fix this issue. Please, review if it's working for to and tell me to do a public release to maven central.

This is the branch: https://github.com/pedrovgs/DraggablePanel/tree/manpreetsinghsodhi-issue17

manpreetsinghsodhi commented 10 years ago

Thanks. This issue is solved.

pedrovgs commented 10 years ago

\o/ Released and uploaded to Maven Central Repository in Release 1.3.