在 SVG（可缩放矢量图形）中，path 元素用于定义路径，其 d 属性规定了路径的绘制指令。以下是所有 path 取值参数及其含义：
移动指令
- M x y 或 m dx dy：
-
- 大写 M：表示绝对移动，将画笔移动到指定的 (x, y) 坐标位置。
-
- 小写 m：表示相对移动，画笔相对于当前位置移动 (dx, dy) 的距离。
直线绘制指令
- L x y 或 l dx dy：
-
- 大写 L：从当前位置绘制一条直线到指定的绝对坐标 (x, y)。
-
- 小写 l：从当前位置绘制一条直线到相对于当前位置偏移 (dx, dy) 的坐标。
- H x 或 h dx：
-
- 大写 H：绘制一条水平直线到指定的绝对 x 坐标。
-
- 小写 h：绘制一条水平直线，相对于当前位置在 x 轴上偏移 dx 的距离。
- V y 或 v dy：
-
- 大写 V：绘制一条垂直直线到指定的绝对 y 坐标。
-
- 小写 v：绘制一条垂直直线，相对于当前位置在 y 轴上偏移 dy 的距离。
闭合路径指令
- Z 或 z：
-
- 不管大小写，该指令都用于闭合当前路径，即从当前位置绘制一条直线回到路径的起始点。
贝塞尔曲线绘制指令
三次贝塞尔曲线
- C x1 y1, x2 y2, x y 或 c dx1 dy1, dx2 dy2, dx dy：
-
- 大写 C：从当前点绘制一条三次贝塞尔曲线到终点 (x, y)，使用两个控制点 (x1, y1) 和 (x2, y2)。
-
- 小写 c：相对坐标方式，相对于当前位置定义控制点和终点。
- S x2 y2, x y 或 s dx2 dy2, dx dy：
-
- 大写 S：用于创建平滑的三次贝塞尔曲线。如果之前的路径指令是 C、S，则使用前一个曲线的第二个控制点的对称点作为当前曲线的第一个控制点，再加上指定的第二个控制点 (x2, y2) 和终点 (x, y) 来绘制曲线。
-
- 小写 s：使用相对坐标。
二次贝塞尔曲线
- Q x1 y1, x y 或 q dx1 dy1, dx dy：
-
- 大写 Q：从当前点绘制一条二次贝塞尔曲线到终点 (x, y)，使用一个控制点 (x1, y1)。
-
- 小写 q：使用相对坐标。
- T x y 或 t dx dy：
-
- 大写 T：用于创建平滑的二次贝塞尔曲线。如果之前的路径指令是 Q、T，则使用前一个曲线的控制点的对称点作为当前曲线的控制点，再加上指定的终点 (x, y) 来绘制曲线。
-
- 小写 t：使用相对坐标。
弧形绘制指令
- A rx ry x-axis-rotation large-arc-flag sweep-flag x y 或 a rx ry x-axis-rotation large-arc-flag sweep-flag dx dy：
-
- 大写 A：从当前点绘制一个椭圆弧到指定的终点 (x, y)。
-
- 小写 a：使用相对坐标。
-
- 参数说明：
-
-
- rx 和 ry：椭圆的 x 和 y 方向的半径。
-
-
-
- x-axis-rotation：椭圆相对于 x 轴的旋转角度。
-
-
-
- large-arc-flag：取值为 0 或 1，决定绘制大弧还是小弧。
-
-
-
- sweep-flag：取值为 0 或 1，决定绘制的弧是顺时针还是逆时针方向。
-
以下是一个简单的 SVG path 示例，包含了上述部分指令：
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<path d="M10 10 L90 10 V90 H10 Z" fill="none" stroke="black" />
</svg>
这个示例绘制了一个简单的矩形，从 (10, 10) 点开始，水平绘制到 (90, 10)，再垂直绘制到 (90, 90)，接着水平绘制到 (10, 90)，最后闭合路径回到起始点。
css 样式
1.
pnpm tauri dev
pnpm tauri build
pnpm tauri android build --apk -t aarch64
pnpm tauri android dev
//安装apk
adb install app-universal-release.apk
一行...显示
width: 806px;
height: 41px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
<van-tabbar route active-color="#00BAAD" inactive-color="#808080" class="yl-tabbar" :border="false"
v-show="route.meta.showTabBar">
<!-- 首页 -->
<van-tabbar-item class="custom-tab" to="/home">
<span>首页</span>
<template #icon="props">
<img :src="props.active ? HomeSelect : Home" width="24px" height="24px" />
</template>
</van-tabbar-item>
<!-- 用餐-->
<van-tabbar-item class="custom-tab" to="/food">
用餐
<template #icon="props">
<img :src="props.active ? FoodSelect : Food" />
</template>
</van-tabbar-item>
<!-- 自定义-->
<van-tabbar-item class="custom-tab">
<!-- <span>自定义</span> -->
<template #icon="props">
<div class="custom-img">
<van-image class="icon-image" :src="CallPhone" width="56px" height="56px" />
</div>
</template>
</van-tabbar-item>
<!-- 通讯录 -->
<van-tabbar-item class="custom-tab" to="/contact">
<span>通讯录</span>
<template #icon="props">
<img :src="props.active ? ContactSelect : Contact" width="24px" height="24px" />
</template>
</van-tabbar-item>
<!-- 我的 -->
<van-tabbar-item class="custom-tab" to="/mine">
<span>我的</span>
<template #icon="props">
<img :src="props.active ? MineSelect : Mine" width="24px" height="24px" />
</template>
</van-tabbar-item>
</van-tabbar>
