如何解决弹性:自定义ProgressBar酒吧的皮肤不会充满整个轨道
| 我正在尝试为flex progressbar控件创建一个简单的外观。轨道和导条都应具有圆角,并且导条应在显示轨道的部分完全填充轨道。 这是我根据此示例创建的工具栏外观:<?xml version=\"1.0\" encoding=\"utf-8\"?>
<s:SparkSkin
xmlns:fx=\"http://ns.adobe.com/mxml/2009\"
xmlns:s=\"library://ns.adobe.com/flex/spark\"
xmlns:mx=\"library://ns.adobe.com/flex/mx\">
<fx:Script>
<![CDATA[
override protected function initializationComplete():void {
useChromeColor = true;
super.initializationComplete();
}
]]>
</fx:Script>
<s:Rect radiusX=\"5\" radiusY=\"5\" top=\"0\" left=\"0\" right=\"0\" bottom=\"0\">
<s:fill>
<s:SolidColor color=\"#bb0203\" />
</s:fill>
</s:Rect>
</s:SparkSkin>
这是进度条声明:
<mx:ProgressBar id=\"progressBar\" name=\"progressBar\" top=\"40\" left=\"10\" width=\"480\" height=\"25\"
label=\"\" labelWidth=\"0\"
trackSkin=\"Skins.ProgressBar.TrackSkin\"
barSkin=\"Skins.ProgressBar.BarSkin\" />
这是轨道皮肤:
<?xml version=\"1.0\" encoding=\"utf-8\"?>
<s:SparkSkin
xmlns:fx=\"http://ns.adobe.com/mxml/2009\"
xmlns:s=\"library://ns.adobe.com/flex/spark\"
xmlns:mx=\"library://ns.adobe.com/flex/mx\"
minHeight=\"25\">
<fx:Script>
<![CDATA[
override protected function initializationComplete():void {
useChromeColor = true;
super.initializationComplete();
}
]]>
</fx:Script>
<s:Rect width=\"100%\" height=\"100%\" radiusX=\"5\" radiusY=\"5\">
<s:fill>
<s:SolidColor color=\"#d1d3d4\" />
</s:fill>
</s:Rect>
</s:SparkSkin>
不幸的是,它并没有达到预期的效果:
横条不是与轨道齐平,而是有边距,并且圆形的边框被切除了。
我该如何解决?
解决方法
除了设置
barSkin
属性外,还将maskSkin
属性设置为与barSkin
相同的值:
您可以使用与代码中其他皮肤相同的方式来分配此皮肤:
<mx:ProgressBar id=\"progressBar\" name=\"progressBar\" top=\"40\" left=\"10\" width=\"480\" height=\"25\"
label=\"\" labelWidth=\"0\"
trackSkin=\"Skins.ProgressBar.TrackSkin\"
maskSkin=\"Skins.ProgressBar.BarSkin\"
barSkin=\"Skins.ProgressBar.BarSkin\" />
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。