Android的：在作出错误对齐/显示9patch图像 [英] Android : Alignment bug in making/showing 9patch image

问题描述

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

    <LinearLayout
        android:id="@+id/edit_tray"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">

        <View
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="@drawable/trash"/>

    </LinearLayout>

</RelativeLayout>

期望的结果：

在edit_tray重presents，将可切换UI元素。当编辑模式是关闭的，edit_tray（因此垃圾桶图标）是水涨船高。当编辑模式是对edit_tray是可见的，覆盖在滚动型内容。

Desired Results:

The "edit_tray" represents a UI element that will be toggleable. When edit mode is off, the "edit_tray" (and therefore the trash can icon) are "gone". When edit mode is on the "edit_tray" is visible and overlaid over the ScrollView contents.

有两个元素的垃圾桶图标：图标本身和它背后的线性渐变。该NinePatch图像包含三个伸缩区域和一个静态区，以容纳这些元素。垃圾桶在图形的中间的图标是静态的，并应在水平中心并在屏幕的底部直接出现。梯度应在整个屏幕的底部伸展从一侧到另一

There are two elements to the trash can icon: The icon itself and the linear gradient behind it. The NinePatch image contains three stretchable areas and one static area to accommodate these elements. The trash can icon in the middle of the graphic is static and should appear directly in the horizontal center and on the bottom of the screen. The gradient should stretch across the bottom of the screen from one side to the other.

的NinePatch图像仅包含一个上水平的图像的任一侧拉伸区域的像素。它的作用应该是垃圾桶图标直接出现在中心（在左边== 1像素的右侧1个像素）。然而，正如你可以在上面的截图中看到情况并非如此。注意：这个截图是从我的测试电话，T-Mobile G2的拍摄。相同的效果可以在仿真器中看到。然而，在draw9patch preVIEW和Eclipse图形布局查看图像是完全分布式的。

The NinePatch image contains only one pixel of stretchable area on either side of the image horizontally. The effect of which should be that the trash can icon appears directly in the center (1 pixel on left side == 1 pixel on right side). However, as you can see in the screenshot above that is not the case. Note: this screenshot was taken from my test phone, a T-Mobile G2. The same effect can be seen in the emulator. However, in the draw9patch preview and the eclipse Graphical Layout view the image is perfectly distributed.

我已经尝试了几种不同的方法，试图找出错误的，并尝试修复它还是解决它。其中包括：使用ImageViews而不是意见（效果相同），采用了android：scaleType =fitXY（同样的问题），在运行时检查该屏幕的宽度和edit_tray的宽度是相同的（他们是）使用渐变的两种不同的图像（如edit_tray背景）和图标（如ImageView的SRC）（创建其中两个影像不是互相重叠的另一个问题。通过设置这两个绝对的高度固定）等。

I've tried several different methods to try to find out where the bug is and to try to fix it or work around it. Including: using ImageViews instead of Views (same effect), using android:scaleType="fitXY" (same issue), checking at runtime that the width of the screen and the width of the "edit_tray" are the same (they are), using two different images for gradient (as edit_tray background) and icon (as ImageView src) (create another problem where the two images were not overlayed on each other. Fixed by setting an absolute height on both), etc.

我使用带每侧最多六个伸缩地区一些简单的NinePatch图像做了一些测试。我注意到有一些问题的测试用例至少有一个（手机，模拟器，draw9patch，图形布局在Eclipse）。

I did some testing using some simple NinePatch images with up to six stretchable areas per side. I noticed there were some issues displaying them in at least one of the testing cases (phone, emulator, draw9patch, Graphical Layout in eclipse).

我决定尝试使有更上显示垃圾箱图标的边缘线性梯度的在水平方向扩大的图像。我做了图像128 * 64（previously 64×64）。我更加的拉伸部分的边缘部分，以试图遏制任何数学不好（？），这是发生在图像。 Draw9patch报道坏的部分，所以我把它回到刚才的两个像素，一边一个。有效！该图标是直接在屏幕上现在的中心！我不知道为什么，但不改变图像的实际拉伸部分，只改变图像的宽度为128，现在的工作。

I decided to try to expand the image horizontally so that there was more of the linear gradient showing on the edges of the trash can icon. I made the image 128x64 (previously 64x64). I made more of the edges part of the stretchable part to try to curb any bad math (?) that was happening to the image. Draw9patch reported bad sections so I put it back to just the two pixels, one on either side. It worked! The icon is directly in the center of the screen now! I don't know why, but without changing the actual stretchable portion of the image, only changing the width of the image to 128, it works now.

我试着调整图像回落到宽100像素左右去除一些多余的像素，误差回来了！它不仅回来，但图标被放置在完全相同的点从屏幕的中心偏移。我想不通为什么会出现这种情况了。

I tried resizing the image back down to around 100px wide to remove some of the redundant pixels and the error came back! Not only did it come back, but the icon was placed at exactly the same spot offset from the center of the screen. I can't figure out why this would happen this way.

任何人有什么想法？这是一个错误？

Anyone have any ideas? Is this a bug?

目前，我有这方面的工作给予我上面介绍的解决方法，但如果任何人有我在听任何建议。

I currently have this working given the workarounds I described above, but if anyone has any suggestions I'm listening.

推荐答案

请您9片图像用 4点正如我在做this..and它会的工作。

Make your 9 Patch image with using 4 points as I have done in this..and it will work.

有关创建9补丁图片。（不是设计师，告诉你我的丰达）

Tips for Creating 9 Patch Image.(not a designer,telling you my funda)

• 放点上左和上


• 如果您有..then放点之间的一些文字或图像左
  以及图像和顶部和图像或文本的底部右侧。


• 总是看到没有留下空间，没有点的两侧（左右和上下）是相等的。


• 始终一旦preVIEW或右侧2个检查使用前检查
  6倍

这篇关于Android的：在作出错误对齐/显示9patch图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！