Android收据/之字形可绘制/布局 [英] Android receipt/zigzag drawable/layout

问题描述

我需要在Android中创建收据布局. 这个想法非常简单，矩形布局的底部边缘呈锯齿形.

I'm in need of creating a receipt layout in Android. The idea is very simple, a rectangle layout with a zigzag bottom edge.

最好的结果是具有固定的锯齿形大小(即固定的半三角形大小)的可绘制/布局， 它将根据形状的实际宽度实时乘以三角形的数量.如有必要，可以夹一个三角形.

The best result would be a drawable/layout with a fixed zigzag size (meaning, fixed half-triangle size), which will multiply the amount of triangles according to the shape's actual width, in real time. With a clip maybe, to have clipped triangles if necessary.

这是一个很好的例子(编辑:我指的是曲折线的底部):

Here is a good example (edit: I'm referring to the bottom zigzag line) :

我实际上对如何创建它没有明确的想法.想到了9个补丁，但似乎不合适.可能想到的是使用水平偏移量绘制列表层的方法.

I actually have no solid idea of how to create it. Thought of 9 patch, but it seems unfitting. Thought of list-layer drawable with horizontal offsets maybe..

也许可以创建一个9个具有单独比例尺部分的面片，以保持锯齿形的纵横比...这也可以.

Maybe it is possible to create a 9 patch with separate scale sections, to keep the zigzag's aspect ratio... This would also be OK.

编辑-答案 使用@Luksprog的注释，我轻松地重新创建了想要的内容.
这是一些代码:

EDIT - ANSWER Using @Luksprog 's comment, I easily recreated what I wanted.
Here is some code:

图片(请注意，高度与源图片的大小相对应):

Image (note that height corresponds to the source image size):

    <ImageView
        android:id="@+id/zigzag_bottom"
        android:layout_width="match_parent"
        android:layout_height="12dp"
        android:adjustViewBounds="true"
        android:scaleType="fitXY"
        android:src="@drawable/zigzag" />    

可绘制:

    <?xml version="1.0" encoding="utf-8"?>
    <bitmap xmlns:android="http://schemas.android.com/apk/res/android"
        android:src="@drawable/ic_zigzag"
        android:tileMode="repeat"
        android:antialias="true"
    />

推荐答案

您无法为该图像绘制9条路径，因为无法在垂直或水平方向上定义可拉伸区域.要获得该锯齿形图案，您可以提取其中一个锯齿形齿(及其背景阴影)并将其包裹在BitmapDrawable中，该BitmapDrawable具有tileMode属性，用于在可绘制范围内重复包裹的图像.这样，锯齿形齿将被重复，您将组成图案.

You can't make a nine path for that image because there is no way to define a stretchable area on either the vertical or horizontal side. To obtain that zig-zag pattern you could extract one of the zig-zag tooth(along with it's background shadow) and wrap it in a BitmapDrawable which has the tileMode property for repeating the wrapped image inside the drawable bounds. This way the zig-zag tooth will be repeated and you'll compose the pattern.

请注意，高度与源图像的大小相对应

note that height corresponds to the source image size

这是一个快乐的情况，但是您可以使它适用于高度不匹配的情况.例如，您可以将之字形BitmapDrawable包装在LayerDrawable中(连同实际视图drawable(用于视图区域的其余部分))，然后使用setLayerInset()将可绘制对象放置在底部.您还可以通过覆盖onDraw()方法来创建自己的drawable，以将锯齿形图案图像放置在底部.

This is a happy scenario, but you could make it work for the case when the height doesn't match. You could for example wrap the zig-zag BitmapDrawable in a LayerDrawable(along with the actual view drawable(for the rest of the view area)) and then use setLayerInset() to place the drawable at the bottom. You could also create your own drawable that places the zig-zag pattern image at the bottom by overriding the onDraw() method.

这篇关于Android收据/之字形可绘制/布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！