วิธีการใช้สกินที่สร้างเองกับสกรอลบาร์ Spark List by Ziah
Jul0
โดยปกติแล้วทางดีไซน์เนอร์จะสร้างทั้งสกรอลล์บาร์มาให้ ซึ่งเราต้องนำมาผูกกับลิสท์ที่เราสร้างขึ้นมาเอง โดยแต่ก่อนนั้นผมใช้ <s:VScrollBar> แล้วเซ็ท property skin ให้เป็น custom skin ของเรา จากนั้นก็เซ็ท viewport ให้เป็นตัว List ของเรา ซึ่งปัญหาคือสกรอลล์ทำงานได้ไม่ถูกต้องเท่าที่ควร มักมีบางส่วนหายไปด้านล่างๆของลิสท์ เราเลยต้องมาเปลี่ยนวิธีกันใหม่ครับ
- ขั้นแรกให้เราสร้างไฟล์ CSS แล้วประกาศไว้ในไฟล์แอปพลิเคชั่นหลักของเราเลยครับ
<fx:Style source=”styles.css”/>
- จากนั้นในไฟล์ให้เราเซ็ทสกินใส่ CSS ไว้ครับ
@namespace s “library://ns.adobe.com/flex/spark”;
@namespace mx “library://ns.adobe.com/flex/mx”;
.friendScroll s|VScrollBar{
skinClass: ClassReference(“components.scrollbarVerticalScrollbar”);
fixedThumbSize:false;
horizontalScrollPolicy: off;
}
- จากนั้นก็เซ็ท property “styleName” ให้ตรงกับที่เราประกาศไว้ใน CSS ครับ
<s:List id=”listFriend” styleName=”friendScroll” dataProvider=”{aFriendList}” itemRenderer=”components.friendCustomComponent” />
แค่นี้สกรอล์ของเราก็จะเปลี่ยนเป็น Custom สกินแล้วครับ แต่บางทีอาจจะต้องมีแก้เล็กน้อยในไฟล์สกินเพื่อให้ตำแหน่งมันตรงกับความเป็นจริงด้วยนะครับ
Enjoy this article?
Consider subscribing to our RSS feed!
ไม่มีความเห็น
ยังไม่มีความเห็น
ใส่ความเห็น
Who are we?
Contact Us
หมวดหมู่
ป้ายกำกับ
บันทึกเก่า
- พฤษภาคม 2017
- กุมภาพันธ์ 2017
- มกราคม 2017
- ธันวาคม 2016
- พฤศจิกายน 2016
- ตุลาคม 2016
- กันยายน 2016
- สิงหาคม 2016
- กรกฎาคม 2016
- มิถุนายน 2016
- พฤษภาคม 2016
- เมษายน 2016
- มีนาคม 2016
- กุมภาพันธ์ 2016
- มกราคม 2016
- ธันวาคม 2015
- พฤศจิกายน 2015
- ตุลาคม 2015
- กันยายน 2015
- สิงหาคม 2015
- กรกฎาคม 2015
- มิถุนายน 2015
- พฤษภาคม 2015
- เมษายน 2015
- มีนาคม 2015
- กุมภาพันธ์ 2015
- มกราคม 2015
- ธันวาคม 2014
- พฤศจิกายน 2014
- ตุลาคม 2014
- กันยายน 2014
- สิงหาคม 2014
- กรกฎาคม 2014
- มิถุนายน 2014
- พฤษภาคม 2014
- เมษายน 2014
- มีนาคม 2014
- กุมภาพันธ์ 2014
- มกราคม 2014
- ธันวาคม 2013
- พฤศจิกายน 2013
- ตุลาคม 2013
- กันยายน 2013
- สิงหาคม 2013
- กรกฎาคม 2013
- มิถุนายน 2013
- พฤษภาคม 2013
- เมษายน 2013
- มีนาคม 2013
- กุมภาพันธ์ 2013
- มกราคม 2013
- ธันวาคม 2012
- พฤศจิกายน 2012
- ตุลาคม 2012
- กันยายน 2012
- สิงหาคม 2012
- กรกฎาคม 2012
- มิถุนายน 2012
- พฤษภาคม 2012
- เมษายน 2012
- มีนาคม 2012
- กุมภาพันธ์ 2012
- มกราคม 2012
- ธันวาคม 2011
- พฤศจิกายน 2011
- ตุลาคม 2011
- กันยายน 2011
- กรกฎาคม 2011
- มิถุนายน 2011
- พฤษภาคม 2011
- เมษายน 2011
- มีนาคม 2011
- กุมภาพันธ์ 2011
- มกราคม 2011
- ธันวาคม 2010
- พฤศจิกายน 2010
- ตุลาคม 2010
- กันยายน 2010
- สิงหาคม 2010
- กรกฎาคม 2010
- มิถุนายน 2010
- พฤษภาคม 2010
- เมษายน 2010
- มีนาคม 2010
- กุมภาพันธ์ 2010
- มกราคม 2010
- ธันวาคม 2009
- พฤศจิกายน 2009
- ตุลาคม 2009
- กันยายน 2009
- สิงหาคม 2009
- กรกฎาคม 2009
- มิถุนายน 2009
- พฤษภาคม 2009
- มีนาคม 2009