SVG 文件在表格布局中越过屏幕并调整 SVG 文件的大小

Question

我想创建一个小游戏，您可以将您的军队派往其他基地，谁可以接管它。
我使用表格布局来显示关卡的不同部分。
我的图片是 svg 文件，但它似乎不适应屏幕尺寸:

我的第一关需要 5 列和 5 行。地图应该是一个简单的正方形，每个角应该是一个底（圆）。小方块应该是"streets"或者基地之间的连接线，是部队要用的。它应该是这样的：

我的问题： 如何使列、行和 svg 文件适合屏幕大小？
因为我认为可以调整 svg 图像的大小而不会降低其质量，并且 android studio 会自动执行此操作，但我不知道如何调整它的大小。
我在第二行也有问题：正如你所看到的两条垂直街道彼此相邻，但我会把第二条街道放在右上角的底部下面。

这里是xml代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/linearLayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="horizontal">

    <TableLayout
        android:id="@+id/tableLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:shrinkColumns="1"
        android:stretchColumns="1">

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content">

            <LinearLayout

                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/base" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/street_h" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/street_h" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/street_h" />

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/base" />

            </LinearLayout>
        </TableRow>

        <TableRow
            android:layout_width="fill_parent"
            android:layout_height="wrap_content">

            <LinearLayout
                android:layout_width="fill_parent"
                android:orientation="horizontal">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@drawable/street_v" />

                <!-- An empty ImageView as a placeholder? -->

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="end"
                    android:src="@drawable/street_v" />
            </LinearLayout>

        </TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content"></TableRow>

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    </TableLayout>
</LinearLayout>

我试过的：
1. 对于第二行，使用 LinearLayout（水平）将 2 个图像放在左侧和上方右边。
2. 添加没有线性布局的图像。
3. 摆弄 android:layout_width 和 android:layout_height.

但其中 none 行得通，我无法在网上找到解决方案:(

我是否为我的想法使用了错误的布局，或者我是否错过了 TableLayout 的一个重要选项？

更新

我终于可以压缩所有 SVG 文件以适应：

我以编程方式完成了所有操作，以便更轻松地创建新关卡，并且我使用了这部分代码：

// parameters for every row
TableRow.LayoutParams rowParameter = new TableRow.LayoutParams();
rowParameter.height = TableRow.LayoutParams.WRAP_CONTENT;
rowParameter.width = TableRow.LayoutParams.WRAP_CONTENT;
rowParameter.weight = 1000;


// parameters for every image
TableRow.LayoutParams imageParameter = new TableRow.LayoutParams();
imageParameter.height = TableLayout.LayoutParams.WRAP_CONTENT;
imageParameter.width = TableLayout.LayoutParams.WRAP_CONTENT;
imageParameter.weight = 1000;

如您所见，图片太小了。我想让他们彼此靠近。我怎样才能做到这一点？

Answer 1

我知道了！我需要做的只是使用更大的 svg-images 和 Image.setAdjustViewBounds(true); 方法 :)

SVG 文件在表格布局中越过屏幕并调整 SVG 文件的大小

SVG Files goes over the screen in tablelayout and resize the SVG-Files

android

android-studio

svg

tablelayout

更新