lt
54 lines
2.8 KiB
XML
54 lines
2.8 KiB
XML
<svg width="400" height="800" viewBox="0 0 400 800" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<style>
|
|
.phone-frame { fill: #2c3e50; }
|
|
.screen { fill: #fff; }
|
|
.header { fill: #4caf50; }
|
|
.text-header { font-family: "PingFang SC", sans-serif; font-size: 24px; fill: #fff; font-weight: bold; }
|
|
.text-body { font-family: "PingFang SC", sans-serif; font-size: 16px; fill: #333; }
|
|
.text-small { font-family: "PingFang SC", sans-serif; font-size: 12px; fill: #7f8c8d; }
|
|
.plant-icon { fill: #4caf50; }
|
|
.result-box { fill: #e8f5e9; stroke: #c8e6c9; stroke-width: 2; rx: 8; }
|
|
.btn { fill: #4caf50; rx: 8; }
|
|
.btn-text { font-family: "PingFang SC", sans-serif; font-size: 18px; fill: #fff; font-weight: bold; }
|
|
</style>
|
|
</defs>
|
|
|
|
<!-- Phone device -->
|
|
<rect x="0" y="0" width="400" height="800" rx="40" class="phone-frame"/>
|
|
<!-- Screen -->
|
|
<rect x="20" y="20" width="360" height="760" class="screen"/>
|
|
|
|
<!-- App Header -->
|
|
<rect x="20" y="20" width="360" height="80" class="header" rx="30"/>
|
|
<text x="200" y="65" text-anchor="middle" class="text-header">花帮主</text>
|
|
|
|
<!-- Main content -->
|
|
<g transform="translate(50, 130)">
|
|
<!-- Upload area -->
|
|
<rect x="0" y="0" width="300" height="250" fill="#f5f5f5" stroke="#ddd" stroke-width="2" rx="10"/>
|
|
<image href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cpath d='M100,20 L120,80 L180,80 L130,120 L150,180 L100,140 L50,180 L70,120 L20,80 L80,80 Z' fill='%234caf50'/%3E%3C/svg%3E" x="75" y="40" width="150" height="150"/>
|
|
<text x="150" y="220" text-anchor="middle" class="text-body" style="font-weight:bold;">识别结果：早疫病</text>
|
|
|
|
<!-- Diagnosis info -->
|
|
<rect x="0" y="280" width="300" height="180" class="result-box"/>
|
|
<text x="20" y="310" class="text-body" style="font-weight:bold;">病害详情</text>
|
|
<text x="20" y="340" class="text-body">病害名称：番茄早疫病</text>
|
|
<text x="20" y="365" class="text-body">置信度：92%</text>
|
|
<text x="20" y="390" class="text-body">严重程度：中度</text>
|
|
|
|
<!-- Recommendations -->
|
|
<text x="20" y="430" class="text-body" style="font-weight:bold;">处理建议</text>
|
|
<text x="20" y="455" class="text-body">1. 移除病叶并销毁</text>
|
|
<text x="20" y="480" class="text-body">2. 使用代森锰锌喷洒</text>
|
|
<text x="20" y="505" class="text-body">3. 增加通风，降低湿度</text>
|
|
<text x="20" y="530" class="text-body">4. 轮作，避免连作障碍</text>
|
|
|
|
<!-- Action button -->
|
|
<rect x="50" y="570" width="200" height="50" class="btn"/>
|
|
<text x="150" y="602" text-anchor="middle" class="btn-text">查看治疗方案</text>
|
|
</g>
|
|
|
|
<!-- Bottom navigation hint -->
|
|
<text x="200" y="770" text-anchor="middle" class="text-small">花帮主 v2.1 - 您的随身园艺顾问</text>
|
|
</svg> |