Flex :: Programmatically Skinng The Roll Over Idicator Of A List Component?
Jul 14, 2010Does anybody know how to add custom rolloveridicatorskins to a flex 3 list component?it doesn't have the rolloveridicatorskin in the css.
View 2 RepliesDoes anybody know how to add custom rolloveridicatorskins to a flex 3 list component?it doesn't have the rolloveridicatorskin in the css.
View 2 RepliesI have a Spark List container whose dataProvider is bound to a result set coming back from a RemoteObject call. Pretty standard stuff.
<s:List id="list" dataProvider="{model.stuff}" width="100%" height="100%"
selectedIndex="@{selectedSlider.value}"
itemRenderer="{stuffRenderer}">
</s:List>
The selectedIndex is associated with an HSlider, but that is not the problem. My issue is that I would like to automatically select a certain "preferred" element from the list (only initially...to guide the user).
I tried to do that in a creationComplete event but my data hadn't shown up yet...setting selectedIndex didn't work..
I want to get rid of the typical Flex roll-over color in list-based components, and to display my own style of roll-over rendering. Setting useRollOver to 'false' is not an option, since disabling that will also make the List.isItemHighlighted() function to always return false. My custom renderer relies on that function. Can it be so hard? Is there no way of setting that roll-over color to transparent? Is there some other way for my renderer to figure out if an item is highlighted?
View 3 RepliesHow to remove validation programmatically from flex componentThis is my method
public static function validateRequired(txt:TextInput, errorMessage:String="This field is required"):Boolean
{
[code]....
I'm using a dateField component (with editable = true) as an itemEditor in a dataGrid. Interestingly, when editing the textInput part of the dateField it doesn't seem to react to an ESC keydown as I would expect, i.e. reload old dateField value and give up focus. This seems to be standard for most other components, but not for as most other components do.
How would you go about implementing such behavior? I can listen to keydown == escape on the TextInput portion, but just realized that I don't know how to tell dateField to give up focus and politely close - in fact I'm not even sure that's the right strategy (maybe I should work at the DataGrid level?
In Flex I've got a component, which is based on a Canvas.It looks like this (I removed the <mx:Script> for better reading):
<mx:Canvas verticalScrollPolicy="off" showEffect="showFX" hideEffect="hideFX" horizontalScrollPolicy="off" creationComplete="doComplete()" xmlns:mx="http://www.adobe.com/2006/mxml" width="63" height="63">[code]....
If I set customComponent.Visible to false, the component gets hidden (as expected). But doesn't trigger the hideFX at all. Am I doing something wrong? Or isn't this the correct way to use hideEffect and showEffect?
I'm building a top view 2D map, that it's objects are stored on the server.The kind of objects are 10 and might be a photo, label, button, lists, mix of them or labels with tooltips.The component must request the "areas" that are missing on screen.An area is 1000x1000 px and is cached in flex.To move in the map, will be like in google maps (drag-and-drop).I should be able to have another list and move objects from one to another using drag-an-drop on objects. Ex.: I grab an objects from a list and I move it on this map, I release the mouse button and the item is placed there.Now the problem is: I build a custom component for this trying to emulate the item renderer for performance and recyclage, implement drag-and-drop on objects and request the areas that are missing?
or
I extend the List component from spark and I add some features as multiple kind of itemrenderers and use recycle on them. Of course it must be able to request the missing areas on the screen and cache it's data.Maybe create a custom layout is needed too.What I need is something that must be really fluid, so the lighter this component is, the better.
UPDATE: *There will be not any object over another.
*I will not use hitTest on bitmaps because all bitmaps are wrapped in another component,as they,for now are itemrenderers.
Anyway I already begin to do this using a class that extends the SkinnableDataContainer and a custom layout. As the layout is not like a grid, is sparse, random items at diferent points(x, y).How to get the localX and localY, relative to item renderer and not to the Spark List, from a DragEvent in Flex 4?
I can change the color of the label in Flex Builder, I can even BIND the color to a variable and that works, but I can't find the Color PROPERTY in order to change or reference it programatically! What is the ActionScript 3.0 code to change the font or color of a piece of text in a Flex RIA - or is caring in what color your text appears too bizzarre a request for a RIA? I wrote whole applications after just minutes of "learning" flex, how come it's taken me three days and I still can't change the color of my stupid label?
View 1 Replieshow to populate a list box component located within a seperate mc in my swf with an array... the array comes from a response from a webservice call. I am not currently on the computer with my source code available so lets just use the following....
listdata[i] = the array i want to populate the list box with..... (listdata1, listdata2, listdata3, listdata4, etc. etc.)
movieclip1 = the MC within my fla containing the list box component
mylist = the actual list component
... just not all that familiar with the format of actionscript when working with objects... using CS3 and as2 btw,
How can I validate if atleast one item has been selected from a list, such that the selectedIndices is set to NULL at the init() of application?
View 1 RepliesIn flex UI, my <mx:list> can not be shown completely because of other component shelterring (for example: the refresh button shelter part of it ). How can I make the <mx:list> in front of all other UI component.
This is my code:
<s:HGroup verticalAlign="middle">
<s:Label text="Choose Log File"/>
<mx:ComboBox id ="logFileChooseCombo" dataProvider="{fileNameList}" width="150" color="0x000000"
[Code]....
How can I extend a spark list to add a UI component on it?
View 1 RepliesI have a list component in my app which shows some tiles and one can navigate through them horizontally and i was wondering how can i add the swipe functionality in it to the left or to the right,is this supported by default when the app is on a touch device? the list is like:
<s:List id="list2" width="100%" height="100%" dataProvider="{ recordingsShown }"
preinitialize="list2_preinitializeHandler(event)"
selectedIndex="0" visible="false">[code]............
when I try to loop through the children of a List component that has buttons in it, I can't seem to access those children. I try
for(var btnNum:Number = 0; btnNum < myList.numChildren; btnNum++)
{
trace(myList.getChildAt(btnNum);[code]......
I have a List of items which is based on the contents of the "category" that a user selects
When the user changes selection, I change the dataProvider of the list be be the contents of the current category.
Sometimes the list contains items, sometimes it does not
Is there a way of hiding the list when it has no items?
I know that I could do this when setting the dataProvider, but it seems like there should be an event or something else that I could be using.
How to skin spark List component so that every adjacent itemRenderer has different color (something like mx DataGrid)?
View 1 RepliesI'm trying to extend the mx:Box container so that two buttons sit on the outside of the container to cycle through it's contents (similar to a scrollbar).
I've made a custom component that looks basically
like "mx:HBox->mx:Button mx:Box mx:Button" where the buttons and box are children of the hbox.
How do I offer the user access to the box (say its dataProvider and itemRenderer) through my custom component?
So they just need to write 'local:MyCustomComponent dataProvider="rar" itemRenderer="rar"/>' and my box inside that component can use it?
I will implement this myself if I can't find it but after 30 minutes of searching on the web I'm a bit surprised this doesn't exist. Basically what I need is a hierarchical list component like the finder app on mac. I want the same functionality as a tree component but displayed as each level having it's own list resulting in multiple lists that depend on each other.
View 1 RepliesI need a List that resizes to exactly fit its content, unless that height exceeds its (dynamically sized) parent container. My requirements are as follows:
The component extends List, or at least acts similarly. variableRowHeight and wordWrap both equal to true. The height of the list cannot be less than minHeight (roughly 32px for scrollbar arrows). The height of the list cannot be greater than the height of the parent container .
Note that the parent container can be resized dynamically.
The height of the list should be updated as the size of both the contents and parent container changes.
Live updating would be preferable but not necessary.
There should be no scrollbars if the content height is less than the parent container height (sounds obvious, but I've had trouble with this too).
The trouble is that with variableRowHeight and wordWrap, it's very hard to know the size of the content at any given time. If the parent container's width is reduced, a line wrap may occur in the list which will change the height of the content. I know I can measure the height of the list content using measureHeightOfItems() + viewMetrics.top + viewMetrics.bottom, but when should I calculate that? What events should I listen for? And the thing I've had the most trouble with - when should I calculate it to set the size initially (i.e. just as the content has finished populating)?
Is there a way display the display list in the Tree component. I could parse the display list into xml but then I would not be able to create a reference to the display object.
View 1 Replieswondering if there's any way to make it so that a list I have will not scroll to show the horizontal end of the items. Very few items go long enough to require it and the horizontal scrollbar is distracting.
I don't see any property to control that, though, so not sure how to achieve this.
I've created a component which is basically a meter (extends skinnable container). The skin to the component contains two rectangles (background and the actual meter). This component receives an arraycollection with the following fields value, max and min(the arraycollection I am passing is Bindable). When I initialize and pass the data to be used to draw It works great (keep in mind - only works the first time). I've created a button that changes the data array and shows the current meter value. Apparently the meter's value is changing everytime I modify the ArrayCollection I've set to be used for rendering.(dont want to say "dataProvider" because it is not a Flex dataprovider, just a variable )... here is the code...
public class meter extends SkinnableContainer {
[SkinPart( required = "true" )]
public var meter:spark.primitives.Rect;
[Code]....
I have a regular spark list which is sorted correctly when no item renderer is used. However, when the following item renderer is used, the list shuffles and displays items from previous instances of the list.[code]
View 2 RepliesI have an arrayCollection of objects that extend Sprite, and have bitmaps within them. I want to display these in a list (or some other component that would allow a user to scroll through them, and see their associated data.)
When I do: myList.dataProvider = myArrayCollection
the list just shows a bunch of lines of [Object, Item] instead of the visual sprites.
Here is a simplified version of my Object:
public class myUIC extends UIComponent
[Code]...
Tried many different ways to get it to show up in a List, but can't do it.
I have the list shown below:
<s:List id="list2" width="100%" height="100%" dataProvider="{ recordingsShown }"
itemRenderer="components.VideoItemRenderer2"
selectedIndex="0" visible="false">
[Code].....
I'm setting selected element in s:List component with Actionscript, it works, but List doesn't scroll to selected item -- need to scroll with scrollbar or mouse. Is it possible to auto-scroll to selected item
View 8 RepliesI am aware that the follow will show a hand cursor:
component.mouseChildren = true;
component.useHandCursor = true;
component.buttonMode = true;
When I do the above on a List component, the hand button is shown and the whole component loses it's interactivity (Hand cursor is shown even on scrollbars).
So how can I show the hand cursor only when rolling over the list items?
I have a list control and i want the user to be able to select many items at a time. Thus I want it to act that if the control key is pressed while he is clicking. Eg if he clicks on a selected row it should become unselected and if he clicks on a unselected row it should become selected.
View 1 RepliesI have a list component that lists certain items..
so, if i click on a certain item..i should get the index this way : var clickedIndex:int = listID.selectedIndex; but how can i count the number of times the variable clickedIndex has been selected? so, if a user keeps clicking on the index[0], i want to know how many
I have found something good here. [URL]..The mouseover effect on the list item is good. Any ideas to make this look.. I can infer that this is happening on mouseover of the Image Component. I think this is similar to google image search preview of images. If anyone have come across a component similar to this kindly share it to me and to all.
View 1 Replies