如何在相对布局或屏幕之外稍微显示 ImageView?如何在屏幕左上角显示橡胶 [英] How to display an ImageView slightly outside a RelativeLayout or outside the screen? How to display a rubber on the topleft of the screen

问题描述

我已经设置了一个相对视图，其中包含我的所有元素(按钮、图像等...).这是我的 Android 应用程序的标题页.
现在我想在整个布局的左上角覆盖LITE"横幅.

我的问题是LITE"横幅图像是一个倾斜的红色橡胶，我需要在屏幕上将其左上角设置为 (-45,-45) 以仅显示我想要的图像部分(附上源图像，以便您了解图像的哪个部分应该在屏幕上可见).

I've setup a relative view with all my elements inside (buttons, images, etc...). It is the title page of my Android application.
Now I would like to overlay "LITE" banner over the whole layout, in the upperleft corner.

My problem is that the "LITE" banner image is an oblique red rubber, and that I need to set its topleft point to (-45,-45) on the screen to only display the part of the image I want (attached is the source image so you can understand what part of the image should be visible on the screen).

我已尝试使用 AbsoluteLayout、RelativeLayout 以编程方式使用 SetLeft 和 SetTop 移动它，但不接受负值.

I have tried the AbsoluteLayout, the RelativeLayout, to move it programmatically with SetLeft and SetTop, but the negative values are not accepted.

有什么想法吗?

推荐答案

我想与社区分享我在这件事上的经验......

I'd like to share my experience on this affair with the community...

这个想法是在我的应用主屏幕的左上角显示一个倾斜的LITE"橡胶.

The idea was to display an oblique "LITE" rubber on the topleft corner of the main screen of my app.

Rod Algonquin 的回答很好.但是，它并没有完全解决我的问题，因为我必须使图片的尺寸适应屏幕高度......以及屏幕方向.恶梦.即使使用相对布局，这也几乎是不可能的，因为图像的隐藏部分从未正确对齐.

Rod Algonquin's answer was fine. However, it did not completely solved my problem, because I had to adapt the picture's dimensions to the screen height...AND to the screen orientation. Nightmare. Even with a relative layout, it was nearly impossible, because the hidden parts of the image were never correctly aligned.

所以我不得不采取不同的工作方式:图片必须向左和向上移动 20%.该怎么做?

So I had to work differently : The picture had to be moved left and top, by 20%. How to do that ?

1) 在 layout.xml 文件中:

1) In the layout.xml file :

• 将 ImageView 插入到 RelativeLayout
• 给相对布局一个 ID

• 配置 ImageView 使其适合其容器 RelativeLayout 的宽度和高度(layout_width="wrap_content" 和 layout_height="wrap_content")

• Insert the ImageView inside a RelativeLayout
• Give the relative layout an ID

• Configure the ImageView to make it fit its container RelativeLayout's width and height (layout_width="wrap_content" and layout_height="wrap_content")

<RelativeLayout
    android:id="@+id/accueil_litebannerlayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <ImageView
        android:id="@+id/accueil_litebanner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="fitXY"
        android:src="@drawable/lite_banner" />
</RelativeLayout>

2) 在你的 activity.java 类文件中:

2) In your activity.java class file :

    //get screen dimensions
        Display display = getWindowManager().getDefaultDisplay();
        Point size = new Point();
        display.getSize(size);
        int ScreenWidth = size.x;
        int ScreenHeight = size.y;
        //set the desired height of the rubber, based on screen's height    
        int myLayoutWidthAndHeight=ScreenHeight/4;

    //get rubber PNG image dimensions
        BitmapFactory.Options options = new BitmapFactory.Options();
        options.inJustDecodeBounds=true;
        BitmapFactory.decodeResource(getResources(),
                R.drawable.lite_banner,options);
        int imageHeight = options.outHeight;
        int imageWidth = options.outWidth;

    //redux_factor has to be calculated, because if the image is reduced, then the translation has to be adapted
        double redux_factor=1;
        if (myLayoutWidthAndHeight<imageWidth) {
            redux_factor=(double)myLayoutWidthAndHeight/imageWidth;
        }
    //determine by how many pixels left and top (same) the image will have to be translated
        double translation_percents=.22;
        double myCroppedMargin_double=imageWidth*translation_percents*redux_factor;
        int myCroppedMargin=(int) Math.round(myCroppedMargin_double);

    //get the image layout
        RelativeLayout litebannerlayout=(RelativeLayout) this.findViewById(R.id.accueil_litebannerlayout);
    //change its parameters (width, height, leftMargin, topMargin)
        RelativeLayout.LayoutParams params=new RelativeLayout.LayoutParams(myLayoutWidthAndHeight,myLayoutWidthAndHeight);
        params.setMargins(-myCroppedMargin, -myCroppedMargin, 0,0);
        litebannerlayout.setLayoutParams(params);

啊.它有效...

您可以使用此示例代码根据百分比或像素数将 imageView 移出屏幕.这段代码也可以调整为将橡胶/横幅放在右上角、左下角、右下角.

You can use this sample code to move an imageView out of the screen, either based on a percentage, or a pixel count. This code can also be adapted to put the rubber/banner in the topright, bottomleft, bottomright corners.

好吧，让我们继续做点别的……

OK, let's move on to something else...

这篇关于如何在相对布局或屏幕之外稍微显示 ImageView?如何在屏幕左上角显示橡胶的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！