Gotcha, I had just been using the tabWidth style incorrectly -- I'd thought I might be able to query it to find out the calculated width if I didn't set it explicitly. Managed to come up with a much better approach to this problem that makes that a moot point, however (see my followup to this thread).

Thanks

- rdo

Susan Chang wrote:

If you call getStyle('tabWidth') but didn't explicitly set tabWidth through
MXML or setStyle(), you'll get undefined because that is the default value.
This allows for the tabs to be at their "natural" height based on the skin
and style properties (font, font size, etc.). If you did set tabWidth
through MXML or setStyle() and you still get undefined, that's not good and
sounds like a bug, but from your description and code, it looks that's not
the case. Please let us know if you have any other questions.


Thanks!
Susan
Flex Team

-----Original Message-----
From: Ryan Olson [mailto:[EMAIL PROTECTED]
Sent: Tuesday, June 01, 2004 1:03 PM
To: [email protected]
Subject: RE: [flexcoders] Using TabBar as a drop target

Thanks for the info Matt. FWIW I found a better solution than the mouse
coordinates approach, I think, using the undocumented
mx.containers.tabclasses.Tab class:

<mx:Script>
import mx.containers.tabclasses.Tab;

function addTabDnDHandlers(evt:Object):Void {
var tab:Tab = Tab(evt.relatedNode);
trace("tab created: "+tab);
tab.addEventListener("dragEnter", tabDragEnter);
tab.addEventListener("dragExit", tabDragExit);
tab.addEventListener("dragDrop", tabDragDrop);
}

private function tabDragEnter(event:Object, format:String):Void {
event.handled = true;
this.drawFocus(true);
}

private function tabDragExit(event:Object, format:String):Void {
this.drawFocus(false);
}

private function tabDragDrop(event:Object, format:String):Void {
this.drawFocus(false);
var data = event.dragSource.dataForFormat("items")[0];
// do what's necessary with the data here; "this" refers to the
// tab that it was dropped onto
}
</mx:Script>


...

<mx:TabBar id="myTabBar" childCreated="addTabDnDHandlers(event);">
...
</mx:TabBar>

This way each individual Tab can work as a DnD listener instead of the
TabBar having to take care of determining which tab was the target. Seems
to work well.

- rdo

> I asked someone here more familiar with the TabBar and Drag and Drop.
> Here's what he said:
>
>
>
> A TabBar is just an HBox, so you can use the getChildAt() function to
> access
> the tabs. You can use the tabs 'x' and 'width' properties to determine its
> size and location. For hiliting, there is no "official" way to do this,
> but
> drawFocus(true)/drawFocus(false) should do what is desired. Of course,
> these
> methods shouldn't be called in general-purpose code since they will
> interfere with the focus manager drawing, but they should be OK to call
> within a drag and drop operation.
>
>
>
> I'm surprised that getStyle('tabWidth') is returning undefined for
> explicitly-set tabWidths. This should work.
>
>
>
> Matt
>
>
>
> -----Original Message-----
> From: Ryan Olson [mailto:[EMAIL PROTECTED]
> Sent: Tuesday, June 01, 2004 11:01 AM
> To: [email protected]
> Subject: [flexcoders] Using TabBar as a drop target
>
>
>
> Hi flexcoders,
>
> I'm trying to use a TabBar as a drop target for dnd operations.
> Basically I need to drag list items to individual destination tabs on
> the TabBar. However, I'm not finding API hooks through which I can
> identify and manipulate individual tabs in the TabBar. For example, in
> the TabBar's dragEnter handler I need to determine which tab is
> currently being hovered over and somehow highlight that tab. I tried
> using the tabWidth style to determine this in a calculation using the
> mouse coordinates, but it looks like getStyle("tabWidth") is undefined
> (I guess that's a style that you can set but not get). Any suggestions
> for how to approach this? Thanks
>
> - rdo
>
>






Reply via email to