2

I'm new with android, and I have to make improvements for an existing app. Inside this app we have a relative layout with a group of 15 imageViews, 1 dynamic imageView and two textViews to which I have to program zoom controls for zooming in and out. The last couple of days I've been reading continuously this website to try to find an answer in the existing questions without any results because lots of questions are without an answer.

My biggest problem is that I don't know which frame or layout to use. All the images are placed and working well in the relative layout, but I don't seem to get the zoom controls working with the content and I've read in different threads and questions that the RelativeLayout doesn't work with zoom at all. I thought of maybe using a FrameLayout but I think it has the same problem.

This is the XML code from the layout:

<RelativeLayout
        android:id="@+id/relativeLayoutMachine"
        android:layout_width="1000dp"
        android:layout_height="550dp"
        android:layout_above="@+id/relativeLayout1"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:background="@color/brm_back_1" >

        <ImageView
            android:id="@+id/imageView01"
            android:layout_width="82dp"
            android:layout_height="67dp"
            android:layout_marginLeft="409dp"
            android:layout_marginTop="83dp"
            android:contentDescription="@id/imageVeuwBandInloopKoker"
            android:src="@drawable/lva_bandinloopkoker" />

        <ImageView
            android:id="@+id/imageView02"
            android:layout_width="82dp"
            android:layout_height="67dp"
            android:layout_marginLeft="409dp"
            android:layout_marginTop="149dp"
            android:contentDescription="@id/imageViewTussenKoker"
            android:src="@drawable/lva_tussenkoker" />

        <ImageView
            android:id="@+id/imageView03"
            android:layout_width="172dp"
            android:layout_height="88dp"
            android:layout_marginLeft="401dp"
            android:layout_marginTop="216dp"
            android:contentDescription="@id/imageViewHMI_Graph_04_Flap"
            android:src="@drawable/lva_flap_open" />

        <ImageView
            android:id="@+id/imageView04"
            android:layout_width="281dp"
            android:layout_height="61dp"
            android:layout_marginLeft="401dp"
            android:layout_marginTop="303dp"
            android:contentDescription="@id/imageViewHMI_Graph_03_Ram"
            android:src="@drawable/lva_ram_retour" />

        <ImageView
            android:id="@+id/imageView05"
            android:layout_width="110dp"
            android:layout_height="47dp"
            android:layout_marginLeft="571dp"
            android:layout_marginTop="257dp"
            android:contentDescription="@id/imageViewHMI_Graph_01_Unit"
            android:src="@drawable/lva_unit" />

        <ImageView
            android:id="@+id/imageView06"
            android:layout_width="51dp"
            android:layout_height="54dp"
            android:layout_marginLeft="431dp"
            android:layout_marginTop="28dp"
            android:contentDescription="@id/imageViewHMI_Graph_15_Feeder"
            android:src="@drawable/lva_feeder_off" />

        <ImageView
            android:id="@+id/imageView07"
            android:layout_width="90dp"
            android:layout_height="40dp"
            android:layout_marginLeft="585dp"
            android:layout_marginTop="218dp"
            android:contentDescription="@id/imageViewHMI_Graph_02_Pump"
            android:src="@drawable/lva_main_motor_off" />

        <ImageView
            android:id="@+id/imageView08"
            android:layout_width="199dp"
            android:layout_height="124dp"
            android:layout_marginLeft="157dp"
            android:layout_marginTop="240dp"
            android:contentDescription="@id/imageViewChannel"
            android:src="@drawable/lva_channel" />

        <ImageView
            android:id="@+id/imageView09"
            android:layout_width="82dp"
            android:layout_height="166dp"
            android:layout_marginLeft="410dp"
            android:layout_marginTop="50dp"
            android:contentDescription="@id/imageViewHMI_Graph_013_Turbo"
            android:src="@drawable/lva_turbo_off"
            android:visibility="invisible" />

        <ImageView
            android:id="@+id/imageView10"
            android:layout_width="88dp"
            android:layout_height="67dp"
            android:layout_marginLeft="402dp"
            android:layout_marginTop="149dp"
            android:contentDescription="@id/imageViewHMI_Graph_012_Perforator"
            android:src="@drawable/lva_perforator_off"
            android:visibility="invisible" />

        <ImageView
            android:id="@+id/ImageView11"
            android:layout_width="88dp"
            android:layout_height="67dp"
            android:layout_marginLeft="408dp"
            android:layout_marginTop="149dp"
            android:contentDescription="@id/ImageViewHMI_Graph_10_Ruffler"
            android:src="@drawable/lva_ruffler_off"
            android:visibility="invisible" />

        <ImageView
            android:id="@+id/ImageView12"
            android:layout_width="174dp"
            android:layout_height="72dp"
            android:layout_marginLeft="362dp"
            android:layout_marginTop="146dp"
            android:contentDescription="@id/ImageViewHMI_Graph_11_Prepress"
            android:src="@drawable/lva_prepress_open"
            android:visibility="invisible" />

        <ImageView
            android:id="@+id/imageView13"
            android:layout_width="46dp"
            android:layout_height="68dp"
            android:layout_marginLeft="356dp"
            android:layout_marginTop="297dp"
            android:contentDescription="@id/imageViewHMI_Graph_07_Needles_Hor"
            android:src="@drawable/lva_needles_hor_none" />

        <ImageView
            android:id="@+id/imageView14"
            android:layout_width="44dp"
            android:layout_height="111dp"
            android:layout_marginLeft="356dp"
            android:layout_marginTop="187dp"
            android:contentDescription="@id/imageViewHMI_Graph_05_Needles_Vert"
            android:src="@drawable/lva_needles_vert_high" />

        <ImageView
            android:id="@+id/imageView15"
            android:layout_width="10dp"
            android:layout_height="24dp"
            android:layout_marginLeft="371dp"
            android:layout_marginTop="272dp"
            android:contentDescription="@id/imageViewHMI_Graph_06_Knotter_Vert"
            android:src="@drawable/lva_motor_off" />

        <FrameLayout
            android:id="@+id/frameLayoutBale"
            android:layout_width="140dp"
            android:layout_height="51dp"
            android:layout_marginLeft="19dp"
            android:layout_marginTop="307dp" >

            <ImageView
                android:id="@+id/imageViewAnimation"
                android:layout_width="140dp"
                android:layout_height="51dp"
                android:layout_gravity="right"
                android:contentDescription="@id/imageViewHMI_Graph_Bale"
                android:scaleType="fitXY"
                android:src="@drawable/baal" />

        </FrameLayout>

        <TextView
            android:id="@+id/textView01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="110dp"
            android:layout_marginTop="316dp"
            android:gravity="right"
            android:text="@string/percentage"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="@color/brm_back_2" />

        <TextView
            android:id="@+id/textView02"
            android:layout_width="142dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="22dp"
            android:layout_marginTop="271dp"
            android:gravity="center"
            android:text="@string/puntjes"
            android:textAppearance="?android:attr/textAppearanceLarge"
            android:textColor="@color/brm_back_2" />

        <ZoomControls
            android:id="@+id/zoomControls"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignRight="@+id/textCurrMaterial" />

    </RelativeLayout>

This is the code I used on my main to declare the zoom controls:

btnZoomControls = (ZoomControls) findViewById(R.id.zoomControls);
btnZoomControls.setOnZoomInClickListener(new View.OnClickListener() {public void onClick(View v) {setZoomIn(); }});
btnZoomControls.setOnZoomOutClickListener(new View.OnClickListener() {public void onClick(View v) {setZoomOut(); }});

And this are the functions for zooming in and out

private void setZoomIn()
{
    m_ZoomController.getContainer();
    m_ZoomController.getZoomControls();
    m_ZoomController.setZoomInEnabled(true);
}

private void setZoomOut()
{
    m_ZoomController.getContainer();
    m_ZoomController.getZoomControls();
    m_ZoomController.setZoomOutEnabled(true);
}

Had any of you a similar problem like mine, and how you found a solution to fix it?

ROMANIA_engineer
  • 54,432
  • 29
  • 203
  • 199
Marialvy Martínez
  • 286
  • 2
  • 6
  • 19
  • `ZoomControls` are just 2 buttons with no further functionality than looking the way you probably want them to. They don't do anything on their own and especially don't zoom any content. – zapl Sep 03 '12 at 12:46
  • My problem is that one way or another I have to zoom the content I have there, using the tools I found or not. If there's nothing I can do with the zoom controls, I have to find other way then to zoom the images I have in my Relative Layout. – Marialvy Martínez Sep 03 '12 at 12:51
  • zooming images is no standard feature of android and you need to do something like http://stackoverflow.com/questions/2537238/how-can-i-get-zoom-functionality-for-images (custom implementation of e.g. `ImageView` or try `WebView`) to get that functionality. – zapl Sep 03 '12 at 12:58

1 Answers1

3

Actually, You have two major ways for zooming:

1) Call setScaleX() and setScaleY() (since API 11) on whole layout or on particular view. Per my experience, images scaling works fine, but text on some versions produces weird behaviour (this scaling get applied by view group during draw process and so, quite fast). This way is quite smooth and fast for not very big layouts;

2) Change layout parameters on every view (You might need, probably, to provide new pictures for image views during scaling). This way is not so fast, but should work on almost all android revisions.

sandrstar
  • 12,503
  • 8
  • 58
  • 65
  • I used what you told me with the buttons and it works fine!!! Now I have to implemate the drag and drop, but for that I've found a couple of questions and answers here to help me. Thanks a lot!!! – Marialvy Martínez Sep 04 '12 at 10:42