Question

我正在寻找一种方法在android（Imageview，Button或frame）中制作某种类型的倾斜视图

我可以实现的任何内容点击它。

在Windows手机中有一些风格如下：

enter image description here

或类似的东西：

enter image description here

屏幕的每个部分（黑线上方或下方）都是可点击的，并且可以创建新的活动。使用staggeredgridview显示具有不同列大小的网格没有问题。但我想这个方法我应该制作服装布局框架而不是网格？

我在play.google.com上找到了另一个示例：

enter image description here

它的某种封面制作某处，图像可以改变，但没有onclick能力在每个视图上。

编辑：从Ernir部署建议：

public abstract class MainActivity extends Activity implements View.OnTouchListener {
final ImageView iv= (ImageView)findViewById(R.id.img_cut_1);
final ImageView iv2= (ImageView)findViewById(R.id.img_cut_2); 

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    findViewById(R.id.img_cut_1).setOnTouchListener(new MyTouchListener());

}

private final class MyTouchListener implements OnTouchListener {
    @Override
    public boolean onTouch(View v, MotionEvent me) {
        if (me.getAction() == MotionEvent.ACTION_DOWN) {
            int vid = v.getId();
            int nTouchX = (int)me.getX();
            int nTouchY = (int)me.getY();
            if (vid == R.id.img_cut_1) {
                Bitmap bm = ((BitmapDrawable)iv.getDrawable()).getBitmap();
                if (bm.getPixel(nTouchX, nTouchY) != 0) {
                   Log.i("MyActivity", "img_cut_1 true");
                    return true;
                }
                return false;
            }
            if (vid == R.id.img_cut_2) {
                Bitmap bm = ((BitmapDrawable)iv2.getDrawable()).getBitmap();
                if (bm.getPixel(nTouchX, nTouchY) != 0) {
                    Log.i("MyActivity", "img_cut_2 true");
                    return true;
                }

                return false;
            }
        }
        return true;
    }
    }

和布局：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

        <FrameLayout
            android:id="@+id/frame"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <ImageView
            android:id="@+id/img_cut_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="center"
            android:src="@drawable/image_cut_1" />
        <ImageView
            android:id="@+id/img_cut_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:scaleType="center"
            android:src="@drawable/ic_launcher" />
    </FrameLayout>
    </RelativeLayout>

但收到此错误：

01-06 11:06:33.242: E/AndroidRuntime(15737): FATAL EXCEPTION: main
01-06 11:06:33.242: E/AndroidRuntime(15737): java.lang.RuntimeException: Unable to instantiate activity ComponentInfo{com.example.test.com/com.example.test.com.MainActivity}: java.lang.InstantiationException: com.example.test.com.MainActivity
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1573)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:1667)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.ActivityThread.access$1500(ActivityThread.java:117)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:935)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.os.Handler.dispatchMessage(Handler.java:99)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.os.Looper.loop(Looper.java:130)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.ActivityThread.main(ActivityThread.java:3687)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at java.lang.reflect.Method.invokeNative(Native Method)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at java.lang.reflect.Method.invoke(Method.java:507)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:867)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:625)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at dalvik.system.NativeStart.main(Native Method)
01-06 11:06:33.242: E/AndroidRuntime(15737): Caused by: java.lang.InstantiationException: com.example.test.com.MainActivity
01-06 11:06:33.242: E/AndroidRuntime(15737):    at java.lang.Class.newInstanceImpl(Native Method)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at java.lang.Class.newInstance(Class.java:1409)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.Instrumentation.newActivity(Instrumentation.java:1021)
01-06 11:06:33.242: E/AndroidRuntime(15737):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:1565)
01-06 11:06:33.242: E/AndroidRuntime(15737):    ... 11 more

我试图在另一个活动中添加整个方法，但这没有帮助。我已经在类中添加了这个方法，因为你提到了“与所有ImageViews相同的OnTouchListener”这个词。

Answer 1

最佳解决方案是将标准化图像划分为多边形，其中每个多边形代表可点击区域。然后附加一个OnTouchListener并检查规范化的触摸坐标是否在多边形内。这个解决方案需要程序员的一些工作以及几何算法的实现。我不会进一步讨论这个解决方案，而是为您提供最简单的解决方案，让您花费最少的时间来实现。我猜这是你想要的，我希望我是对的:)。

没有第三方库的最简单的解决方案

请注意，此解决方案不具有内存效果，应谨慎使用

1。您将图像切割成几张大小相同的图像，每张图像只包含一个可点击的区域，其余图像都是透明的。如果我使用您问题中的第一个图像作为示例，则其中一个图像将如下所示：

sample http://magma.is/test/stackoverflow.png

2. 现在，您将这些图片叠加在多个重叠的ImageViews

中

....
<FrameLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" >

    <ImageView
        android:id="@+id/img_cut_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="center"
        android:src="@drawable/image_cut_1" />
    <ImageView
        android:id="@+id/img_cut_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="center"
        android:src="@drawable/image_cut_2" />
...

3. 在您的活动/片段中，您将相同 OnTouchListener设置为所有ImageView。在那里，您通过透明度消除发现了ImageView真正被触摸过，然后您获得了关于图像的哪个区域（或按钮，如果您愿意）被按下所需的信息。

@Override
public boolean onTouch(View v, MotionEvent me) {
    if (me.getAction() == MotionEvent.ACTION_DOWN) {
        int nTouchX = (int)me.getX();
        int nTouchY = (int)me.getY();
        if (v == imageCut1) {
            Bitmap bm = ((BitmapDrawable)imageCut1.getDrawable()).getBitmap();
            if (bm.getPixel(nTouchX, nTouchY) != 0) {
                // non-transparent pixel touched, we found our view, receive further motion events. This can also be set false and code inserted here.
                return true;
            }
            // transparent pixel touched, do not receive further motion events.
            return false;
        }
        if (v == imageCut2) {
            ...

如果您只想要用户点击，您可以继续并行或更好地使用OnClick，请使用MotionEvent.ACTION_UP操作并检查DOWN和UP动作事件之间的点击漂移和最大时间延迟。在MotionEvent.ACTION_UP中有这样的东西:(并注意只有“正确的”ImageView会给你这个动作事件，因为我们丢弃了其他视图的进一步动作事件）

if (
    mMainDragStartX <(me.getX()+TAP_DRIFT_TOLERANCE) && 
    mMainDragStartX > (me.getX() -TAP_DRIFT_TOLERANCE) && 
    mMainDragStartY <  (me.getY() + TAP_DRIFT_TOLERANCE) &&
    mMainDragStartY > (me.getY() - TAP_DRIFT_TOLERANCE) &&
    ((SystemClock.elapsedRealtime() - mMainDraggingStarted) < SINGLE_TAP_MAX_TIME)) {
// The user has tapped!
...

Answer 2

你必须自定义布局，让我指出一个例子

QuiltViewLIbrary

StaggeredGridView

StaggeredGridView更像是Pinteerest的。因此，您将使用其中一个作为模板并编写一个新的GridLayout类，将图像置于更改中以制作梯形或三角形。

不，它不是非网格布局......你必须自定义gridlayout。

耕种数学将有点像彭罗斯，做谷歌搜索，你会发现为此目的的java库。

Answer 3

我们需要考虑两件事：

1＆gt;显示您提到的具有不同形状的图像：

您必须在Android中使用可缩放矢量图形。

尝试使用此CustomShapeImageView

逻辑：比如说你需要显示4个偏斜的图像所有你要做的就是使用tis CustomShapeImageView库实用创建4 Framelayout （每个图像一个Framelayout），每个Framelayout中都有 imageview 。

2＆gt;在每张图片上制作并点击事件：

在每张图片上制作并点击活动！您应该尝试使用OnTouchListener。

在android中制作倾斜的视图

3 个答案:

没有第三方库的最简单的解决方案