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

Нужно реализовать, как мне кажется, довольно простую задачу, однако решения, которое меня бы устраивало я не могу найти уже несколько дней. Суть такова. Есть 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 не "убегала"?
или
Может есть какой-то более рациональный и логичный способ реализовать то, что мне нужно?
Заранее спасибо за все ответы и за понимание!

Ответ

Нашел кое-какое решение. Может не очень красивое, но мне помогло, может кому пригодится:
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 связаны между собой.