Как связать несколько ImageView в ScrollView или WebView? - Android

#java #android #webview #imageview

Нужно реализовать, как мне кажется, довольно простую задачу, однако решения, которое
меня бы устраивало я не могу найти уже несколько дней.
Суть такова. Есть 4 картинки которые должны скролиться вместе. Основная картинка
(в нижнем правом углу) должна скролиться во всех направлениях (x, y и по диагонали).
Картинка сверху от нее должна скролиться вместе с ней по горизонтали. Картинка слева
от нее - вместе с ней по вертикали. Ну и картинка в левом верхнем - просто картинка,
которая скролиться не должна.
Ниже приведу 2 варианта решения которые я рассматривал, но не смог их реализовать
так, что бы меня это устраивало.
1 вариант

Разместить ImageView в ScrollView и связать их перемещение в setOnTouchListener:



//просто картинка




    //картинка слева
    




    //картинка сверху
    






    //основная картинка
    








public class Gost8509 extends Activity implements View.OnTouchListener {


    HorizontalScrollView hScroll1, hScroll2;
    VScrollView vScroll1;
    ScrollView vScroll2;
    float mx, my, curX, curY;
    private boolean started = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.gost8509);

        hScroll1 = (HorizontalScrollView) findViewById(R.id.scrollHorizontal1);
        hScroll1.setOnTouchListener(this);
        hScroll2 = (HorizontalScrollView) findViewById(R.id.scrollHorizontal2);
        hScroll2.setOnTouchListener(this);
        vScroll1 = (VScrollView) findViewById(R.id.scrollVertical1);
        vScroll1.setOnTouchListener(this);
        vScroll2 = (ScrollView) findViewById(R.id.scrollVertical2);
        vScroll2.setOnTouchListener(this);
        vScroll1.sv = hScroll1;
    }

    @Override
    public boolean onTouch(View v, MotionEvent event) {
        curX = event.getX();
        curY = event.getY();
        int x = (int) (mx - curX);
        int y = (int) (my - curY);
        switch (event.getAction()) {
            case MotionEvent.ACTION_MOVE:
                if (started) {
                    vScroll1.scrollBy(0, y);
                    vScroll2.scrollBy(0, y);
                    hScroll1.scrollBy(x, 0);
                    hScroll2.scrollBy(x, 0);
                } else {
                    started = true;
                }
                mx = curX;
                my = curY;
                break;
            case MotionEvent.ACTION_UP:
                vScroll1.scrollBy(0, y);
                vScroll2.scrollBy(0, y);
                hScroll1.scrollBy(x, 0);
                hScroll2.scrollBy(x, 0);
                started = false;
                break;
        }
        return true;
    }
}


При этом способе у меня перестает работать "бросок" (что естественно) и основная
загвоздка в том, что если основная картинка очень больших размеров, то она перестает
отображаться в эмуляторе.

2 способ
Расположить все картинки в WebView:




    

    

        

    

    

        

    

    

        

    




В этом случае все картинки отображаются без проблем, но если их связать таким образом
как в первом варианте, то картинка при скролле уползает за границы экрана) и опять
естественно не работает "бросок". 

А теперь вопрос )
Как реализовать первый способ, что бы большие картинки отображались на устройстве
и работал бросок?

или

Как реализовать второй способ, что бы работал бросок и картинка в WebView не "убегала"?

или 

Может есть какой-то более рациональный и логичный способ реализовать то, что мне нужно?

Заранее спасибо за все ответы и за понимание!
    

Ответы

Ответ 1

Нашел кое-какое решение. Может не очень красивое, но мне помогло, может кому пригодится:

relLayout.getViewTreeObserver().addOnScrollChangedListener(new ViewTreeObserver.OnScrollChangedListener() {
        @Override
        public void onScrollChanged() {
            if (webview1.isFocused()) {
                webview3.setScrollX(webview1.getScrollX());
            }
            if (webview2.isFocused()) {
                webview3.setScrollY(webview2.getScrollY());
            }
            if (webview3.isFocused()) {
                webview1.setScrollX(webview3.getScrollX());
                webview2.setScrollY(webview3.getScrollY());
            }
        }
    });


Таким образом получается, что прокрутки всех 3-х WebView связаны между собой.