- 浏览: 938150 次
- 性别:
- 来自: 大连
文章分类
- 全部博客 (242)
- Flex (38)
- Java (15)
- iBatis (4)
- Spring (15)
- Oracle (4)
- Cognos (4)
- ActionScript (17)
- AIR (14)
- Box2D (1)
- Windows8 (3)
- AIR Mobile (4)
- Quartz (6)
- mybatis (7)
- CGLIB (1)
- Mobile (9)
- BlazeDS (3)
- IOS (8)
- FlashBuilder (1)
- Scout (1)
- Starling (5)
- APNS (3)
- Chrome (3)
- Windows (2)
- MySQL (15)
- Feathers (1)
- Tomcat (5)
- JavaPNS (1)
- SVN (2)
- XAMPP (1)
- Drupal (1)
- Linux (2)
- VSFTPD (1)
- jQuery (5)
- Discuz (2)
- Word (1)
- PHP (1)
- OFFICE (2)
- javascript (15)
- 微信 (1)
- 博客 (1)
- jquery mobile (5)
- nginx (1)
- memcached (1)
- maven (3)
- log4j (2)
- GitHub (2)
- html5 (3)
- WebSocket (2)
- Mac (11)
- Apache (1)
- JUnit (1)
- Eclipse (1)
- Openfire (1)
- HLS (1)
- Swift (6)
- Excel (2)
- IDE (4)
- NodeJS (8)
- 树莓 (3)
- CSS (2)
- PhoneGap (1)
- Angular.js (5)
- bootstrap (1)
- angular (5)
- React (1)
- Browserify (1)
- Ruby (1)
- WebService (1)
- CXF (1)
- redis (2)
- Dubbo (1)
- Jedis (1)
- solr (1)
- yeoman (1)
- grunt (1)
- bower (1)
- gulp (3)
- Git (2)
- angularJS (4)
- fastjson (1)
- Spring-Boot (1)
- Vue (1)
- Motan (1)
- Python (1)
最新评论
-
July01:
最近了解到一款StratoIO打印控件,功能如下:1、Html ...
NodeJS使用ipp协议打印 -
小“味”子:
不错不错,试了,是可以的
Mac下连接SQL Server客户端 -
akka_li:
我遇到这个问题了!我的原因是配置文件里写得各个包的xsd文件的 ...
Referenced file contains errors (http://www.springframework.org/schema...错误 -
迪伦少校:
我只想知道,你最后配置成功了吗?我这里怎么tomcat总是死呢 ...
关于 Nginx+Tomcat+Memcached做负载均衡加共享session -
LiYunpeng:
jun23100 写道我也遇到这个问题了,环境都是正确的,怎么 ...
关于HTML5请求WebSocket,404的问题
转自
http://prsync.com/adobe/creating-a-custom-skin-to-add-tics-and-labels-to-spark-sliders-7788/
There has been some recent discussion over how to get tics and labels on Spark Sliders. Halo Sliders contained built in support for tics and labels, however, this feature does not yet exist for Spark Sliders. While built in support may be added in the future, for the time being the way to get tics and labels for a Spark Slider is to implement a custom skin. With the new Spark skinning architecture, this is relatively easy to do.
For example, to get labels for an HSlider, you could simply copy, rename, and then modify the HSliderSkin.mxml file.
First, copy HSliderSkin.mxml and give it a new name, i.e. CustomHSliderSkin.mxml. When you define the HSlider in your application, use the skinClass style to point to the new skin.
<s:HSlider skinClass="CustomHSliderSkin"/>
This assumes that the CustomHSliderSkin.mxml file is in the same directory as the application file. If it is in another directory, the full path to the file must be specified. For example, if the CustomHSliderSkin.mxml file were in a sub-directory named "skins", you would specify it as "skins.CustomHSliderSkin".
In the CustomHSliderSkin file you can add labels in any number of ways. For this example I will use the SimpleText component, but really anything from a BitmapGraphic to a Rect could be used.
To add a label that displays the string "min" to the left hand side of the HSlider, you can define a SimpleText component as follows:
<s:SimpleText id="leftLabel" left="0" top="0" text="min"/>
Since the SimpleText component above has been positioned flush with the left hand side of the container, the HSlider track needs to be moved over so that they do not overlap. To do so, set the "left" style constraint on the track to a value that gives the label enough room to be displayed and provides the spacing that you find aesthetically pleasing. In this case a value of 30 would be sufficient to display the label "min".
Using the same approach, a label can be added to the right side of the HSlider. For example:
<s:SimpleText id="rightLabel" right="0" top="0" text="max"/>
Again, space needs to be given to ensure that the HSlider track and the right side SimpleText component do not overlap. In this case, setting the "right" style constraint on the HSlider track to 30 will work as well.
The skin would therefore contain the following:
<!-- Defines the left label -->
<s:SimpleText id="leftLabel" left="0" top="0" text="min"/>
<!--- Defines the skin class for the CustomHSliderSkin's track. The default skin class is CustomHSliderTrackSkin. -->
<s:Button id="track" left="30" right="30" top="0" bottom="0" skinClass="skins.CustomHSliderTrackSkin" />
<!--- Defines the skin class for the CustomHSliderSkin's thumb. The default skin class is CustomHSliderThumbSkin. -->
<s:Button id="thumb" top="0" bottom="0" width="11" height="11" skinClass="skins.CustomHSliderThumbSkin" />
<!-- Defines the right label -->
<s:SimpleText id="rightLabel" right="0" top="0" text="max"/>
By modifying the style constrains used above you can move the labels above or below the HSlider track in whatever way you want. For example, for labels on top of the HSlider, you could simply move the Slider track and thumb down by setting the top style constraint for both to 20, and leaving left and right as 0. In that case, the skin would contain the following:
<!-- Defines the top left label -->
<s:SimpleText id="leftLabel" left="0" top="0" text="min"/>
<!--- Defines the skin class for the CustomHSliderSkin's track. The default skin class is CustomHSliderTrackSkin. -->
<s:Button id="track" left="0" right="0" top="20" bottom="0" skinClass="skins.CustomHSliderTrackSkin" />
<!--- Defines the skin class for the CustomHSliderSkin's thumb. The default skin class is CustomHSliderThumbSkin. -->
<s:Button id="thumb" top="20" bottom="0" width="11" height="11" skinClass="skins.CustomHSliderThumbSkin" />
<!-- Defines the top right label -->
<s:SimpleText id="rightLabel" right="0" top="0" text="max"/>
In this way, labels of any type can be very quickly added to an HSlider, and of course the same approach can be used to VSlider.
To add tics, a similar approach is used.
Like labels, tics can be implemented in any number of ways. The most straight forward way is to simply insert them manually at the desired position on the Slider track.
Anything can be used as a tic - a BitmapGraphic, a Rect, a Line - anything the developer chooses. In keeping with the label example above, the following method can be used to insert tics using a SimpleText component. The hardest part of adding tics is determining where they should be placed. In the example below, the x property is used to specify the location of the tic.
These tics would be useful for an HSlider with the snapInterval property set to 25 since they are positioned in a rough correspondence to multiples of 25 on a HSlider track with a minimum of 0 and maximum of 100, i.e. the HSlider would look like this in the application:
<s:HSlider minimum="0" maximum="100" snapInterval="25" skinClass="CustomHSliderSkin"/>
CustomHSliderSkin.mxml would then contain the following:
<!-- Define tics -->
<s:SimpleText text="|" x="34"/>
<s:SimpleText text="|" x="66"/>
<s:SimpleText text="|" x="99"/>
<s:SimpleText text="|" x="131"/>
<s:SimpleText text="|" x="164"/>
<s:SimpleText id="leftLabel" left="0" top="12" text="min"/>
<!--- Defines the skin class for the CustomHSliderSkin's track. The default skin class is CustomHSliderTrackSkin. -->
<s:Button id="track" left="30" right="30" top="12" bottom="0" skinClass="spark.skins.spark.HSliderTrackSkin" />
<!--- Defines the skin class for the CustomHSliderSkin's thumb. The default skin class is CustomHSliderThumbSkin. -->
<s:Button id="thumb" top="12" bottom="0" width="11" height="11" skinClass="spark.skins.spark.HSliderThumbSkin" />
<s:SimpleText id="rightLabel" right="0" top="12" text="max"/>
With this approach, tics and labels can be manually added to a Slider skin.
http://prsync.com/adobe/creating-a-custom-skin-to-add-tics-and-labels-to-spark-sliders-7788/
There has been some recent discussion over how to get tics and labels on Spark Sliders. Halo Sliders contained built in support for tics and labels, however, this feature does not yet exist for Spark Sliders. While built in support may be added in the future, for the time being the way to get tics and labels for a Spark Slider is to implement a custom skin. With the new Spark skinning architecture, this is relatively easy to do.
For example, to get labels for an HSlider, you could simply copy, rename, and then modify the HSliderSkin.mxml file.
First, copy HSliderSkin.mxml and give it a new name, i.e. CustomHSliderSkin.mxml. When you define the HSlider in your application, use the skinClass style to point to the new skin.
<s:HSlider skinClass="CustomHSliderSkin"/>
This assumes that the CustomHSliderSkin.mxml file is in the same directory as the application file. If it is in another directory, the full path to the file must be specified. For example, if the CustomHSliderSkin.mxml file were in a sub-directory named "skins", you would specify it as "skins.CustomHSliderSkin".
In the CustomHSliderSkin file you can add labels in any number of ways. For this example I will use the SimpleText component, but really anything from a BitmapGraphic to a Rect could be used.
To add a label that displays the string "min" to the left hand side of the HSlider, you can define a SimpleText component as follows:
<s:SimpleText id="leftLabel" left="0" top="0" text="min"/>
Since the SimpleText component above has been positioned flush with the left hand side of the container, the HSlider track needs to be moved over so that they do not overlap. To do so, set the "left" style constraint on the track to a value that gives the label enough room to be displayed and provides the spacing that you find aesthetically pleasing. In this case a value of 30 would be sufficient to display the label "min".
Using the same approach, a label can be added to the right side of the HSlider. For example:
<s:SimpleText id="rightLabel" right="0" top="0" text="max"/>
Again, space needs to be given to ensure that the HSlider track and the right side SimpleText component do not overlap. In this case, setting the "right" style constraint on the HSlider track to 30 will work as well.
The skin would therefore contain the following:
<!-- Defines the left label -->
<s:SimpleText id="leftLabel" left="0" top="0" text="min"/>
<!--- Defines the skin class for the CustomHSliderSkin's track. The default skin class is CustomHSliderTrackSkin. -->
<s:Button id="track" left="30" right="30" top="0" bottom="0" skinClass="skins.CustomHSliderTrackSkin" />
<!--- Defines the skin class for the CustomHSliderSkin's thumb. The default skin class is CustomHSliderThumbSkin. -->
<s:Button id="thumb" top="0" bottom="0" width="11" height="11" skinClass="skins.CustomHSliderThumbSkin" />
<!-- Defines the right label -->
<s:SimpleText id="rightLabel" right="0" top="0" text="max"/>
By modifying the style constrains used above you can move the labels above or below the HSlider track in whatever way you want. For example, for labels on top of the HSlider, you could simply move the Slider track and thumb down by setting the top style constraint for both to 20, and leaving left and right as 0. In that case, the skin would contain the following:
<!-- Defines the top left label -->
<s:SimpleText id="leftLabel" left="0" top="0" text="min"/>
<!--- Defines the skin class for the CustomHSliderSkin's track. The default skin class is CustomHSliderTrackSkin. -->
<s:Button id="track" left="0" right="0" top="20" bottom="0" skinClass="skins.CustomHSliderTrackSkin" />
<!--- Defines the skin class for the CustomHSliderSkin's thumb. The default skin class is CustomHSliderThumbSkin. -->
<s:Button id="thumb" top="20" bottom="0" width="11" height="11" skinClass="skins.CustomHSliderThumbSkin" />
<!-- Defines the top right label -->
<s:SimpleText id="rightLabel" right="0" top="0" text="max"/>
In this way, labels of any type can be very quickly added to an HSlider, and of course the same approach can be used to VSlider.
To add tics, a similar approach is used.
Like labels, tics can be implemented in any number of ways. The most straight forward way is to simply insert them manually at the desired position on the Slider track.
Anything can be used as a tic - a BitmapGraphic, a Rect, a Line - anything the developer chooses. In keeping with the label example above, the following method can be used to insert tics using a SimpleText component. The hardest part of adding tics is determining where they should be placed. In the example below, the x property is used to specify the location of the tic.
These tics would be useful for an HSlider with the snapInterval property set to 25 since they are positioned in a rough correspondence to multiples of 25 on a HSlider track with a minimum of 0 and maximum of 100, i.e. the HSlider would look like this in the application:
<s:HSlider minimum="0" maximum="100" snapInterval="25" skinClass="CustomHSliderSkin"/>
CustomHSliderSkin.mxml would then contain the following:
<!-- Define tics -->
<s:SimpleText text="|" x="34"/>
<s:SimpleText text="|" x="66"/>
<s:SimpleText text="|" x="99"/>
<s:SimpleText text="|" x="131"/>
<s:SimpleText text="|" x="164"/>
<s:SimpleText id="leftLabel" left="0" top="12" text="min"/>
<!--- Defines the skin class for the CustomHSliderSkin's track. The default skin class is CustomHSliderTrackSkin. -->
<s:Button id="track" left="30" right="30" top="12" bottom="0" skinClass="spark.skins.spark.HSliderTrackSkin" />
<!--- Defines the skin class for the CustomHSliderSkin's thumb. The default skin class is CustomHSliderThumbSkin. -->
<s:Button id="thumb" top="12" bottom="0" width="11" height="11" skinClass="spark.skins.spark.HSliderThumbSkin" />
<s:SimpleText id="rightLabel" right="0" top="12" text="max"/>
With this approach, tics and labels can be manually added to a Slider skin.
发表评论
-
flex Post请求乱码问题
2013-08-13 14:46 840在flex端使用decodeURIComponent 正常来 ... -
关于AIR资源文件打包不到bin-debug里面的原因可能
2013-03-18 16:02 1650此问题也适用于Flex 首先说明我的状况 在使用外部加载资源 ... -
使用Spring BlazeDS出现Error creating bean with name '_messageBroker': Invocation***
2013-01-19 22:03 10200我这里的情况其实是在写Junit的时候出现的这个错误,但是应该 ... -
关于Flex初始化时访问的stage为null的问题
2012-12-19 22:09 1779在使用Flex编写AIR程序的时候 访问this.stage ... -
关于Tweenlite的一些使用参数
2012-12-10 10:34 1554在网上找了很多关于Tweenlite的讲解和说明,但是在实际应 ... -
Flex Mobile移动开发通过BlazeDS与服务器通信遇到的链接频道失败问题
2012-11-29 23:33 2052producer channel faulted with C ... -
Flex Mobile移动开发报类似错误E:\dev\4.y\frameworks\projects\framework\src\mx\managers
2012-11-07 11:00 1113类似错误 看起来很莫名其妙,居然有个绝对路径的信息,但是 ... -
ActionScript 停止load进来的swf声音
2012-10-18 12:16 1127单独通过 loader的unload是无法消除声音的 load ... -
在用Firefox中Flashplayer debug flex/flash的时候超时出现crashed崩溃的解决办法
2012-09-25 18:03 1290在用Firefox中Flashplayer debug fle ... -
关于itemEditor中输入框焦点和List的焦点冲突问题
2012-08-10 23:20 1144今天发现,在List或者DataGrid中,重写itemEdi ... -
关于TextArea中textHeight和textWidth计算值不正确的解决办法
2012-08-09 11:46 1301参考这里面,具体什么原因导致的还不清楚 http://idle ... -
关于ActionScript的对象克隆
2012-06-13 16:53 1119public static function clon ... -
关于ArrayCollection的连接
2012-05-10 15:53 1091最近两天翻了个大错误 在写父子递归嵌套的时候,用到Array ... -
关于FlashBuilder4+处理BlazeDS的Web工程中,修改部署目录的问题
2012-05-07 11:09 1323最近遇到了个问题 以前都是用Flex Builder3来做项目 ... -
[RPC Fault faultString="Cannot create class of type 'ArrayCollection'."
2012-05-04 15:09 2723[RPC Fault faultString="Ca ... -
Flex的Transient 元数据标签
2012-04-27 10:21 1375Flex中的Transient 元数据标签的意思和英文一样。 ... -
Flex查看隐藏日志信息,通过mx.logging.Log
2012-04-25 10:50 1421在网上找的 使 用步骤新建TraceTarget var t ... -
使用RemoteObject时,提示Object@*** 转换为 mx.messaging.messages.IMessage
2012-04-17 15:14 2375TypeError: Error #1034: 强制转换类型失 ... -
FLEX 里的全局错误处理
2012-04-01 12:10 933转自http://args.cn/post/2010/02/t ... -
自定义组合原件并且不当做child组件来管理,无需override addChild、removeChild、getChildIndex等方法
2012-03-29 16:56 1148自定义组合原件并且不当做child组件来管理,无需overri ...
相关推荐
微信小程序slider自定义样式,这个样式不是真正控制在slider上的,而且用view层级覆盖来进行制作,是自己纯手工写的,不喜勿喷哦!
主要介绍了WPF滑块控件(Slider)的自定义样式的相关知识,本文给大家介绍的非常详细,具有一定的参考借鉴价值 ,需要的朋友可以参考下
提供 : video,Slider 组件的 基本使用 信息
两个滑动块的拖动条,并可自定义拖动条的样式.通过拖动条中的两个滑动块可获取这个区间的值。同时还可以自定义滑杆、拖动条中的区分间隔,以及两个滑块之间的相连处。其中包含一个多滑块滑杆的自定义控件的架包。
此自定义控件不使用原生的QSlider,完全重新写的一个Slider功能。可实现SetChannelImage传入Slider背景图,SetThumbImage传入推子图,SetRange设定有效值范围,便可高效实现Slider功能。
自定义双向slider双向滑动实现文字区间选择并显示
基于国外的 MacPopup 苹果风格,自己很喜欢,但是国外提供的 该控件 是基于flex 3的 ,所以在目前flex4为主流的 sdk 情况下,会出现错误。本控件 已经做了修正。可以直接运行。请指导。
WPF自定义进度条控件和slider 滑块控件源代码,WPF样式可自定义,ProgressBar,Slider,共享学习.
自定义slider,实现图片化,更加美观
Swift 自定义双向 Slider.zip,swift中的自定义范围滑块
自定义slider 双向限制滑块的位置
该源码案例是一款开源自定义Slider/Stepper组件,源码SnappingSlider,SnappingSlider可以取代你的slider或者step控制,用户通过左滑或右滑来调整数值,调整完成之后滑块滑回中间。 测试环境:Xcode 6.2,iOS 8.0...
iphone 自定义的类似slider的颜色选取器iphone 自定义的类似slider的颜色选取器iphone 自定义的类似slider的颜色选取器
这是一个jQuery插件,简单易用,自持自定义样式的滑动条(Slider)
day44-Custom Range Slider(自定义范围滑块)
自定义滑块 埃斯特上课联合国PROYECTO去实习课阙他realizado科莫inspiración人版本视频去胡安·安德烈斯·恩 。 实践技术的实践经验禁止在公共场所发信给任何未成年人的问题。 Tecnologíasempleadas HTML(con ...
具有标签,自定义插槽和样式选项的Vue 3切换组件。 滑块功能 Vue 2和3支持 100%覆盖 ESM支持 完全可配置 单滑块 多个滑块 工具提示 格式设定 演示版 查看我们的演示。 安装 npm install @vueform/slider Vue 3的...
将WPF的ListBox定制化为一个Slider,学习自定义WPF控件的必备范例啊。
flutter_circular_slider Flutter的可自定义圆形滑块。入门安装添加flutter_circular_slider : ^lastest_version到您的pubspec.yaml,然后运行flutter packages get 在项目的根目录中。基本用法使用命令创建一个新...
自定义滑竿视图 带有刻度的滑竿 继承自UIControl 内置三种样式可选 触摸结束时滑块会自动吸附到最靠近的刻度上, 本工程只用作技术讨论和交流上请勿商用谢谢.