8

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

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

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">

//просто картинка
<ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/imageView8"
    android:src="@drawable/corner8509"
    android:contentDescription="@string/ugolokravn1" />

<ScrollView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/scrollVertical2"
    android:layout_below="@+id/imageView8"
    android:scrollbars="none"
    android:fadingEdge="none">

    //картинка слева
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView7"
        android:src="@drawable/left8509"
        android:contentDescription="@string/ugolokravn2" />
</ScrollView>

<HorizontalScrollView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/scrollHorizontal2"
    android:layout_alignParentTop="true"
    android:layout_toRightOf="@+id/imageView8"
    android:layout_toEndOf="@+id/imageView8"
    android:scrollbars="none"
    android:fadingEdge="none">

    //картинка сверху
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView6"
        android:src="@drawable/top8509"
        android:contentDescription="@string/ugolokravn3" />
</HorizontalScrollView>

<com.pavel.sortament.VScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id = "@+id/scrollVertical1"
    android:layout_below="@+id/scrollHorizontal2"
    android:layout_toRightOf="@+id/scrollVertical2"
    android:layout_toEndOf="@+id/scrollVertical2"
    android:scrollbars="none"
    android:fadingEdge="none">

<HorizontalScrollView
    android:id = "@+id/scrollHorizontal1"
    android:layout_width = "wrap_content"
    android:layout_height = "wrap_content"
    android:scrollbars="none"
    android:fadingEdge="none">

    //основная картинка
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/image1"
        android:src="@drawable/content8509"
        android:contentDescription="@string/ugolokravn4" />
</HorizontalScrollView>

</com.pavel.sortament.VScrollView>

</RelativeLayout>



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:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageView1"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:contentDescription="@string/app_name"
        android:src="@drawable/corner8509"/>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentLeft="true"
        android:id="@+id/linearLayout"
        android:layout_alignTop="@+id/linearLayout2"
        android:layout_toLeftOf="@+id/linearLayout2">

        <WebView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/webView3" />

    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_toRightOf="@+id/imageView1"
        android:layout_below="@+id/imageView1"
        android:id="@+id/linearLayout2">

        <WebView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/webView4" />

    </LinearLayout>

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignBottom="@+id/imageView1"
        android:layout_toRightOf="@+id/imageView1">

        <WebView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@+id/webView2" />

    </LinearLayout>

</RelativeLayout>

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

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

или

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

или

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

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

5
  • Вы часом не imageCrop изобретаете?) 29 янв 2016 в 7:26
  • Возможно)) я новичек сейчас разберусь сначала, что такое imageCrop что бы сказать да или нет))
    – f1n
    29 янв 2016 в 7:48
  • Может быть подскажете как он применяется или ссылку кинете на информацию, если не сложно.
    – f1n
    29 янв 2016 в 7:50
  • я пользуюсь вот этим github.com/ArthurHub/Android-Image-Cropper 29 янв 2016 в 9:17
  • Спасибо ,но это не то, мне не нужно обрезать картинку, мне нужно, что бы несколько картинок скроллились одновременно((
    – f1n
    30 янв 2016 в 13:03

1 ответ 1

5

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

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 связаны между собой.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.