线性布局内的Android自定义视图与其他视图

Posted 2023-02-26

【中文标题】线性布局内的Android自定义视图与其他视图

【英文标题】：Android Custom View inside Linear Layout with other views

【发布时间】：2015-09-23 11:05:04

【问题描述】：

我有一个自定义视图来显示一个简单的饼图。 我的意图是通过布局 xml 文件获取一些值，例如大小、背景颜色等。 我将圆的半径、笔画宽度等作为 视图高度的因素（宽度等于父/屏幕的宽度），所有尺寸都基于此半径。

这是我的片段布局 xml

<LinearLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_
android:layout_
android:background="@color/bluegrey200"
tools:context="ash.dbtest.GraphpieChartFragment">

    <ash.dbtest.GraphPieChartView
        android:layout_
        android:id="@+id/pieChart1"
        custom:backgroundColor="@color/bluegrey800"
        custom:labelColor="@color/white"
        android:layout_
        />

现在看起来非常好。

看图：

黑色矩形是被覆盖的 onDraw 方法中使用的区域。注意显示矩形边界的蓝色对角线。 我知道高度以像素为单位，它必须以 dp 为单位；但这些值现在用于调试目的。

我将布局 xml 文件更改为下方，以便在另一个线性布局中的自定义视图上方添加横幅。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:custom="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_
android:layout_
android:background="@color/bluegrey200"
tools:context="ash.dbtest.GraphPieChartFragment">
<LinearLayout
    android:layout_
    android:orientation="horizontal"
    android:layout_>
    <TextView
        android:layout_
        android:text="TestBanner"
        android:textSize="20sp"
        android:layout_ />
    </LinearLayout>
    <ash.dbtest.GraphPieChartView
        android:layout_
        android:id="@+id/pieChart1"
        custom:backgroundColor="@color/bluegrey800"
        custom:labelColor="@color/white"
        android:layout_
        />

现在看截图，很奇怪。

在此处查看图片：

现在我的自定义视图移动到底部，但被截断了。 onDraw 方法获得了正确的尺寸，并且正确地绘制了圆。但不知何故，视图被截断了。在下面的屏幕截图中，请注意黑色矩形不完整，蓝色对角线被截断。 可能是什么问题？ 我是 android 的初学者，希望我已经提供了所有必需的信息。我没有发布代码，因为它只是画布上的基本绘制。 非常感谢您花时间在这方面。

GraphPieCharView.onDraw 上的代码

  @Override
public void onDraw(Canvas canvas) 

    Log.d("onDraw","onDraw");
    Log.d("onDraw1",Float.toString(this.getLeft()));
    Log.d("onDraw2",Float.toString(this.getTop()));
    Log.d("onDraw3",Float.toString(this.getRight()));
    Log.d("onDraw4",Float.toString(this.getBottom()));
    paint.setAntiAlias(true);
    paint.setFilterBitmap(true);
    paint.setStrokeWidth(20);
    paint.setStyle(Paint.Style.STROKE);
    paint.setColor(BACKGROUND_COLOR);
    canvas.drawRect(this.getLeft(),this.getTop(),this.getRight(),this.getBottom(),paint);

【参考方案1】：

因为您的 GraphPieChartView 在 TextView 下方

【讨论】：

GraphPieChartView 低于 TextView，这是预期的。我的问题是为什么 Rectangle 会被截断。我的 onDraw 方法中的代码要点已添加到问题中

【参考方案2】：

想通了。 我正在使用下面的代码绘制矩形 canvas.drawRect(this.getLeft(),this.getTop(),this.getRight(),this.getBottom(),paint);

假设页面高 1500 像素，宽 1000 像素。 在这里，当 customview 是页面上的唯一视图时，下面是 getter 的结果。 左 - 0 顶部 - 0 对 - 1000 底部 - 800

我在这些边界内绘制了矩形，所有的计算都基于这些边界；它工作得很好。

现在，当自定义视图是垂直列出的第二个视图时，顶部的 TextView 占 50px，

左 - 0 前 50 名 对 - 1000 底部 - 850

但是这些值是相对于整个屏幕的（1000*1500）。 但在我的自定义视图中，我拥有的画布是 1000*800，从 0,0 开始，到对角线 1000,800 结束。 但是我在画布上绘图，好像它从 0,50 开始，到 1000,850 结束。

将 onDraw 方法中的计算调整为始终从 0,0 开始，并解决了该问题。

感谢所有回复。

【讨论】：

您的解决方案的问题是它不适用于其他尺寸的屏幕（例如 480*800）。你打算只发布 1000*1500 屏幕吗？ - 你应该使用 'getMeasured...()' 然后调整 'drawRect()' 的值。