How to update the color of (the state of) the cell during resize in mxgraph? - mxgraph

I want to change the color of a state of a cell during resize of the cell.
To achieve this, I have added the following code to mxVertexHandler.prototype.updateLivePreview:
mxVertexHandler.prototype.updateLivePreview = function (me) {
...
this.state.x = this.bounds.x;
this.state.y = this.bounds.y;
this.state.origin = new mxPoint(this.state.x / scale - tr.x, this.state.y / scale - tr.y);
this.state.width = this.bounds.width;
this.state.height = this.bounds.height;
...
this.state.shape.fill = "#CCCCCC";
this.state.shape.fillOpacity = 30;
...
}
What happens is that this code changes the opacity of the cell while resized, but does not change the fill color.
How can I cange the fill color too?
Thanks,
-- Jaap

No, that does not work either.
BTW, I thought that temporal changes, e.g. during a resize, should go via the state.
I do not understand why fillOpacity (and other properties) works, and fill not. It seems that the fill is overwritten somewhere else (e.g. after calling updateLivePreview), but I can not figure out where.

Related

how to set min an max width to anchor popup in flex?

if(anchorWidthFlag)
{
popUp.popUpWidthMatchesAnchorWidth = false;
popUp.explicitWidth = anchorWidth;
}
here AnchorWidthFlag = true and anchorWidth = 350;
i tried this way
1) popUpWidthMatchesAnchorWidth = false
2) explicitWidth = anchorWidth //350
but not get appropriate output.
I want to set minWidth and maxWidth to anchor popup, can anyone help me?
Try to set popUpWidthMatchesAnchorWidth to false and set minWidth and maxWidth on dropDown group. If I understood what you want, it would work.
Setting minWidth/maxWidth on popupAnchor woudn't make any effect due to the fact, that popup is not a child of popupAnchor. So standard flex measuring steps wouldn't work here. Though popup doesn't know parent minWidth/maxWidth. If you open the source code of PopUpAnchor you will see that if popUpWidthMatchesAnchorWidth is true the size of popup is set to explicit size of the popupAnchor, but there is no code about minWidth/maxWidth. If you really need to set these sizes on PopUpAnchor you would extend PopUpAnchor class and implement this functionality.

Masked images not displaying in AS3

I am trying to mask an image on another so that I only view the specific portion of the unmasked image through the masked one. My problem is that I cannot see anything on the screen.. no Image, no effect at all
cardMask = new Image(Root.assets.getTexture("card_mask"));
cardMask.y = Constants.STAGE_HEIGHT*0.40;
cardMask.x = Constants.STAGE_WIDTH *0.48;
trace("it's add mask");
cardLight = new Image(Root.assets.getTexture("card_light_mask"));
cardLight.y = Constants.STAGE_HEIGHT*0.46;
cardLight.x = Constants.STAGE_WIDTH *0.48;
cardLight.mask=cardMask;
maskedDisplayObject = new PixelMaskDisplayObject(-1,false);
maskedDisplayObject.addChild(cardLight);
maskedDisplayObject.x=cardLight.x;
maskedDisplayObject.y=cardLight.y;
maskedDisplayObject.mask=cardMask;
maskedDisplayObject.blendMode = BlendMode.SCREEN;
addChild(maskedDisplayObject);
First, for masking an object the mask object should also be added to the display list. Your code does not add cardMask to display list anywhere. Second, if your maskedDisplayObject should be visible at all times, the mask should be assigned not to it, but to some other object which displayed part you desire to control. And third, it is also possible that this.stage is null, therefore the entire tree (this -> maskedDisplayObject -> cardLight) is plain not rendered. You need to check all three of these conditions to get something displayed.
Also, if you desire cardLight as an object to move independently of maskedDisplayObject, you should add it to this instead, and check that it's displayed on top of maskedDisplayObject (call addChild(cardLight) after addChild(maskedDisplayObject)).
This all totals to this code:
trace("Stage is null:", (this.stage==null)); // if this outputs true, you're out of display
cardMask = new Image(Root.assets.getTexture("card_mask"));
cardMask.y = Constants.STAGE_HEIGHT*0.40;
cardMask.x = Constants.STAGE_WIDTH *0.48; // mask creation unaltered
trace("it's add mask");
cardLight = new Image(Root.assets.getTexture("card_light_mask"));
cardLight.y = Constants.STAGE_HEIGHT*0.46;
cardLight.x = Constants.STAGE_WIDTH *0.48;
cardLight.mask=cardMask; // this is right
maskedDisplayObject = new PixelMaskDisplayObject(-1,false);
// maskedDisplayObject.addChild(cardLight); this is moved to main part of display list
maskedDisplayObject.x=cardLight.x;
maskedDisplayObject.y=cardLight.y;
// maskedDisplayObject.mask=cardMask; NO masking of this, you're only masking cardLight
cardLight.blendMode = BlendMode.SCREEN; // display mode is also changed
addChild(maskedDisplayObject);
addChild(cardLight);

Getting/comparing Flash color filters dynamically

I know I can apply a Color Filter in Flash by hand, and then copy it to other movieclips dynamically, like so:
newMovieClip.filters = oldMovieClip.filters;
What I would love to do now is be able to check if two movieclips have the same filter.
Something like this:
if (newerMovieClip.filters == oldMovieClip.filters)
...that always comes out as false, even if the two have the same filter. I know I can make this work if I use a colorTransform instead, but I can't in this case. The graphics have lines and shading that are all changing color together, and the brightness/hue/contrast are all important so filters are key.
(What I'm doing: I have clothing items in the menu that the user "colors" by picking a filtered button from a palette I made. When they click the item, and it's not already on the avatar in that color, I want it to appear and/or turn that color. If it's already on the avatar and the same color, I want it to come off... hence the filter check)
EDIT: I see now that you are only dealing with a Color Filter. Ahh. I understand what trying to do now.
this can make things a little easier if that is the only filter on each Movieclip.
In this case we can get each ColorMatrixFilter of each movieclip by moiveclip.filters[0]
then:
function compareColorFilters(a:ColorMatrixFilter, b:ColorMatrixFilter) : Boolean
{
var length:uint = (a.matrix.length > b.matrix.length)?a.matrix.length:b.matrix.length;
for(var i:uint = 0; i < length; ++i)
{
if(a.matrix[i] != b.matrix[i]) { return false; }
}
return true;
}
then to compare to movieclips would be
if(compareColorFilters(ColorMatrixFilter(oldClip.filters[0]), ColorMatrixFilter(newClip.filters[0])) {
//do stuff
}
As you can see you are getting each ColorMatrixFilters from each moveiClip. Then comparing there matrices (which is just an array) element by element. If the Matrices are the same... The colors, brightness, and hues are also the exact same. If confused at all by this, leave a comment.
Hope this helps!
-Travis

Dynamic body not responding to .ApplyForce

I have a dynamic body and in my update loop when I use SetLinearVelocity I am able to move it, however when I use ApplyForce the body won't move at all. Is there something I'm missing in regards to applying a force to a b2DynamicBody?
var force:b2Vec2 = new b2Vec2();
if (keyIsDown(Keys.S)) force.y = 6;
if (keyIsDown(Keys.A)) force.x = -6;
if (keyIsDown(Keys.D)) force.x = 6;
_body.SetAwake(true);
if (force.x != 0 || force.y != 0)
_body.ApplyForce(force, _body.GetPosition());
Thanks in advance.
Is this code in your update function? Did you make sure force is set to 6?
I would also make sure the force is big enough to move the object. Maybe increase it to 60 or 600 and see if it makes a difference. If the friction is high small forces won't move objects.

Get the default height of a scroll bar

What is the default height of a scroll bar(Horizontal)?
I couldn't find the document online.
UPDATED: Can we write a javascript function to get it? Please don't down vote it. It is hard to get it.
Thank you.
Found this here: How can I get the browser's scrollbar sizes?
function getScrollBarWidth () {
var inner = document.createElement('p');
inner.style.width = "100%";
inner.style.height = "200px";
var outer = document.createElement('div');
outer.style.position = "absolute";
outer.style.top = "0px";
outer.style.left = "0px";
outer.style.visibility = "hidden";
outer.style.width = "200px";
outer.style.height = "150px";
outer.style.overflow = "hidden";
outer.appendChild (inner);
document.body.appendChild (outer);
var w1 = inner.offsetWidth;
outer.style.overflow = 'scroll';
var w2 = inner.offsetWidth;
if (w1 == w2) w2 = outer.clientWidth;
document.body.removeChild (outer);
return (w1 - w2);
};
alert( getScrollBarWidth () );
That's going to depend on the clients screen resolution and browser. If you explain why your asking then I might be able to give a better answer.
Whatever the user's computer is set to. There is no hard-and-fast rule on this. For example, on my Ubuntu machine, the default scroll bar size is 0 - instead of a conventional scrollbar, it has a scroll line with arrows that appear when the mouse moves near it, and it takes no space on the document. However, on my Windows installation, the scrollbar size is 14 pixels, but I could set it from anything between about 8 and over 500...
Interesting question. My thought is: when a property you are interested in is not readily available, test.
One DOM property I can think of that would be affected by the scrollbar height is the clientHeight of the body (or whatever box has the scrollbar) if you set it to 100%. This is maybe a dumb approach, and not sure how useful it really is, but check it out:
get clientHeight before
expand width of an internal element, wide enough to cause a scrollbar
get clientHeight after
subtract
I made a fiddle of this. Like I said, not sure how useful this approach could be in real life, but maybe it's a start on something.
http://jsfiddle.net/brico/t6zMN/