Question

刚刚开始使用svg's。

我正在尝试绘制一个带边框的简单矩形，但似乎边框会以某种方式给我一个类似阴影的效果。它似乎绘制了比顶部和左边界更厚的右边和底边。非常奇怪。

当我进行圆形边缘和正常锐边时会发生这种情况。

以下是代码：

public class Map extends FragmentActivity implements OnMapReadyCallback, ConnectionCallbacks, OnConnectionFailedListener{
    @Override
    protected void onDestroy() {
        super.onDestroy();
 // To stop the service when the user closed the app in the background and the map ativity was opened.      
        stopAlarm();
        Intent i = new Intent(this, TrackingService.class);
        stopService(i);
        System.out.println("ABC Map onDestroy() was invoked!");

    }
}

我已经加入了PLNKR：http://plnkr.co/edit/HGBTNyjasqzwtguOIbnV

Answer 1

您的矩形被<svg>的边缘剪裁。笔划宽度使矩形更宽，但不会自动调整其位置。将x="1"和y="1"添加到您的<rect>

<rect x="1" y="1" width="30" height="30" rx="5"
        style="fill:rgb(255,255,255);stroke-width:1;stroke:rgb(0,0,0)"/>

Answer 2

@Matthew是正确的。另一种解决方案是将属性Flutter的SVG默认值修改为overflow: hidden。

svg矩形边框未正确绘制

2 个答案: