in ActionScript2 there is a way to intercept the click on a movieClip?
I'll explain; I've this code:
planGroup.createEmptyMovieClip("textObject", 90);
if (textArray != "")
{
for (tn = 0; tn < textArray.length; tn++)
{
textFormat = new TextFormat();
textFormat.size = 100 * 0.35;
var lbl = planGroup.textObject.createTextField("My_Instance_Name", tn,xt - minPlanX, yt - minPlanY,150,90);
lbl.text = textArray[tn].attributes.text;
xt = textArray[tn].attributes.x * multFactor;
yt = -textArray[tn].attributes.y * multFactor;
planGroup.textObject.createEmptyMovieClip("invis", getNextHighestDepth());
with (planGroup.textObject.invis) {
beginFill(0x22ffff, 50);
moveTo(xt - minPlanX, yt - minPlanY);
lineTo(xt - minPlanX + 150, yt - minPlanY);
lineTo(xt - minPlanX + 150, yt - minPlanY + 90);
lineTo(xt - minPlanX, yt - minPlanY + 90);
lineTo(xt - minPlanX, yt - minPlanY);
endFill();
}
planGroup.textObject.onRelease = function() {
trace("click");
}
that is I want to make the text clickable..and with this code it is, but i want the onRelease() makes different things on different text..so, how can I understand where the click come from?
Furthermore i noticed that the shape is drawn only on the last item of the 'for'.
Any ideas? Thanks in advance!
Related
I'm using Titanium SDK 5.1.2.GA. I have a bar like TabGroup on Android and iOS. I move the scroll when a tab is not completely visible in the view and you click that tab.
On iOS works perfectly but on Android doesn't work fine.
This is my code to move the scroll view:
if((view.rect.x + view.rect.width) > (toolbarX + $.toolbar.rect.width)){
$.toolbar.scrollTo(((view.rect.x + view.rect.width) - $.toolbar.rect.width) + 10, 0);
}else if(view.rect.x < toolbarX){
$.toolbar.scrollTo(view.rect.x - 10, 0);
}
$.toolbar -> ScrollView
view -> tab
This photo explain my problem:
I've seen this JIRA ticket on Internet
https://jira.appcelerator.org/browse/TIMOB-17954
This will be the problem??
EDIT
This problem is caused by the new unit system on Appcelerator.
I have this line on my tiapp.xml
<property name="ti.ui.defaultunit" type="string">dp</property>
but other functions on Titanium return their values on px, so that's a problem.
My question now is:
What units return the event listeners like 'scroll'?? (px or dp)
Because my toolbarX = e.x from scroll event
What units need scrollTo(x,y)????
THE SOLUTION:
if(Alloy.Globals.isAndroid){
var measure = require('alloy/measurement');
//Vemos si tenemos que mover la toolbar
if((view.rect.x + view.rect.width) > (toolbarX + $.toolbar.rect.width)){
$.toolbar.scrollTo(((measure.dpToPX(view.rect.x) + measure.dpToPX(view.rect.width)) - measure.dpToPX($.toolbar.rect.width)) + 10, 0);
}else if(view.rect.x < toolbarX){
$.toolbar.scrollTo(measure.dpToPX(view.rect.x) - 10, 0);
}
}else{
//Vemos si tenemos que mover la toolbar
if((view.rect.x + view.rect.width) > (toolbarX + $.toolbar.rect.width)){
$.toolbar.scrollTo(((view.rect.x + view.rect.width) - $.toolbar.rect.width) + 10, 0);
}else if(view.rect.x < toolbarX){
$.toolbar.scrollTo(view.rect.x - 10, 0);
}
}
}
$.toolbar.addEventListener('scroll', function(e){
Ti.API.info("-- toolbarX: " + e.x + " / " + Alloy.Globals.measure.pxToDP(e.x));
if(Alloy.Globals.isAndroid){
toolbarX = Alloy.Globals.measure.pxToDP(e.x);
}else{
toolbarX = e.x;
}
});
This problem is new because that:
<property name="ti.ui.defaultunit" type="string">dp</property>
Now, you have to GUESS in what units (px or dp) you have to pass the values on Android, because some functions return px and need px and the others dp.
this works for me
if (OS_ANDROID) {
$.tabbar.scrollTo(Util.DPUnitsToPixels(x), 0);
} else {
$.tabbar.scrollTo(x, 0);
}
on android convert dp to pixel
I am trying to create an application which should consist of a line drawn when keyboard key is pressed. When the left arrow in the keyboard is pressed then the line should move in left direction. When right arrow in the keyboard is pressed then the respective line should move in right direction.
I think it is possible with Path class but I don't know how to implement. Even I don't know how to start the code. Can you please guide me how to draw the line in windows store apps.
private PathGeometry DrawGeometry()
{
bool largeArc = WedgeAngle > 180.0;
Size outerArcSize = new Size(Radius, Radius);
Size innerArcSize = new Size(InnerRadius, InnerRadius);
Point innerArcStartPoint = Utilities.ComputeCartesianCoordinate(RotationAngle, InnerRadius);
Point ButtomLineEndPoint = Utilities.ComputeCartesianCoordinate(RotationAngle, Radius);
Point OuterArcEndPoint = Utilities.ComputeCartesianCoordinate(RotationAngle + WedgeAngle, Radius);
Point EndLineEndPoint = Utilities.ComputeCartesianCoordinate(RotationAngle + WedgeAngle, InnerRadius);
innerArcStartPoint.X += CentreX;
innerArcStartPoint.Y += CentreY;
ButtomLineEndPoint.X += CentreX;
ButtomLineEndPoint.Y += CentreY;
OuterArcEndPoint.X += CentreX;
OuterArcEndPoint.Y += CentreY;
EndLineEndPoint.X += CentreX;
EndLineEndPoint.Y += CentreY;
PathFigure path = new PathFigure();
path.StartPoint = innerArcStartPoint;
ArcSegment InnerArc = new ArcSegment();
InnerArc.Size = innerArcSize;
InnerArc.SweepDirection = SweepDirection.Counterclockwise;
InnerArc.Point = innerArcStartPoint;
InnerArc.IsLargeArc = largeArc;
LineSegment ButtomLine = new LineSegment();
ButtomLine.Point = ButtomLineEndPoint;
ArcSegment OuterArc = new ArcSegment();
OuterArc.SweepDirection = SweepDirection.Clockwise;
OuterArc.Point = OuterArcEndPoint;
OuterArc.Size = outerArcSize;
OuterArc.IsLargeArc = largeArc;
LineSegment EndLine = new LineSegment();
EndLine.Point = EndLineEndPoint;
path.Segments.Add(ButtomLine);
path.Segments.Add(OuterArc);
path.Segments.Add(EndLine);
path.Segments.Add(InnerArc);
PathGeometry myPath = new PathGeometry();
myPath.Figures.Add(path);
return myPath;
}
This code will Draw a Pie slice for you as I was building a PieChart it Containsn Lines Curves etc. It will save lots of your time
How to access urls of images and xy coordinates from the DOM.
I have a div with multiple image gifs in it.
The gifs represent electronic components on stripboard or protoboard.
The img gifs are generated using this code.
function createDiv(img)//img here original code was for creating new divs
{
alert(divnumber);//an incrementing or decrementing image array position counter
{
var divTag = document.createElement("img");
divTag.id ='part'+divnumber;
imageArray[divnumber+1]=200;//arbitrary inital x placement
imageArray[divnumber+2]=200;//arbitrary initial y placment
divTag.className ="dragme";
divTag.src = imageArray[divnumber];//gif;//imageArray[i];
document.body.appendChild(divTag);
}
divnumber=divnumber+3;//offset between gif url in image array
}
The gifs are draggable using this code. I don't fully understand drag code but it was the simplest I could find and make work.
//<script language="JavaScript1.2">
<!--
var ie=document.all;//if using explorer
var nn6=document.getElementById&&!document.all;//if using netscape
var isdrag=false;//are we dragging??
var x,y;
var dobj;//drag object
function movemouse(e)
{
if (isdrag) //if drag istrue
{
dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x;
//alert(dobj.style.left);
dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y;
return false;
}
}
function selectmouse(e)
{
var fobj = nn6 ? e.target : event.srcElement;
var topelement = nn6 ? "HTML" : "BODY";
while (fobj.tagName != topelement && fobj.className != "dragme")
{
fobj = nn6 ? fobj.parentNode : fobj.parentElement;
}
if (fobj.className=="dragme")
{
isdrag = true;
dobj = fobj;
tx = parseInt(dobj.style.left+0);
//alert(tx);
ty = parseInt(dobj.style.top+0);
x = nn6 ? e.clientX : event.clientX;
//alert(x +' "=y);
y = nn6 ? e.clientY : event.clientY;
document.onmousemove=movemouse;
return false;
}
}
document.onmousedown=selectmouse;//go to selectmouse when mouse down in document
document.onmouseup=new Function("isdrag=false");
//-->
I need to put all the gifs and x y coordinates into an array that I can save with html5 local storage.
I can save an array and recall it ok.
But I need to fill the array with urls and xy coords of draggable items.
I can't figure how to get that info from either the dragging code or the DOM.
I think I can get that info from the dom image list but I still cant get up to speeds on all the dom details.
Can anyone tell me how to identify the gif url and xy coordinates from either the drag code or the DOM.
This is basically my last hurdle before I can comnplete the prrogram.
Many Thanks. I am mainly a cut and paste and hacking found scripts in my programming level.
Oh!! I am almost 70 and this IS NOT a homework problem!!
Thanks markE for last help.
TiMathis
After further thought I can probably dig the xy's out of the drag code but how can I determine which gif is being dragged?
OK I can get the objects id ...alert(dobj.id)
I should be able to use that to get other info for immage array info I need.
if (fobj.className=="dragme")
{
isdrag = true;
dobj = fobj;
alert(dobj.id);
tx = parseInt(dobj.style.left+0);
//alert(tx);
ty = parseInt(dobj.style.top+0);
x = nn6 ? e.clientX : event.clientX;
//alert(x +' "=y);
y = nn6 ? e.clientY : event.clientY;
document.onmousemove=movemouse;
return false;
}
}
I am working on a Dashing project using Sinatra, and I am displaying Graphs on the dashboard. I've been having a lot of trouble with displaying Timestamps on the X-Axis, Now that I have this working, I have another problem. On my graph, the x-axis keeps repeating the timestamp over and over again. What I mean by this is that it does not show any of the previous timestamps it just repeats the current timestamp over and over again, this is not what I want. Below is my code for the graph:
class Dashing.Graph extends Dashing.Widget
#accessor 'points', Dashing.AnimatedValue
#accessor 'current', ->
return #get('displayedValue') if #get('displayedValue')
points = #get('points')
if points
points[points.length - 1].y
#ready is triggered when ever the page is loaded.
ready: ->
container = $(#node).parent()
# Gross hacks. Let's fix this.
width = (Dashing.widget_base_dimensions[0] * container.data("sizex")) + Dashing.widget_margins[0] * 2 * (container.data("sizex") - 1)
height = (Dashing.widget_base_dimensions[1] * container.data("sizey"))
#graph = new Rickshaw.Graph(
element: #node
width: width
height: height
renderer: #get("graphtype")
series: [
{
color: "#fff",
data: [{x:0, y:0}]
}
]
)
#graph.series[0].data = #get('points') if #get('points')
format = (d) ->
months = new Array(12)
months[0] = "Jan"
months[1] = "Feb"
months[2] = "Mar"
months[3] = "Apr"
months[4] = "May"
months[5] = "Jun"
months[6] = "Jul"
months[7] = "Aug"
months[8] = "Sep"
months[9] = "Oct"
months[10] = "Nov"
months[11] = "Dec"
today = new Date()
month = today.getMonth()
day = today.getDate()
h = today.getHours()
m = today.getMinutes()
if(m <= 9)
d = months[month] + " " + day + " " + h + ":" + 0 + m
else
d = months[month] + " " + day + " " + h + ":" + m
x_axis = new Rickshaw.Graph.Axis.X(graph: #graph,pixelsPerTick: 100, tickFormat: format )
y_axis = new Rickshaw.Graph.Axis.Y(graph: #graph, tickFormat: Rickshaw.Fixtures.Number.formatKMBT)
#graph.render()
#onData is responsible for handling data sent from the jobs folder,
#any send_event methods will trigger this function
onData: (data) ->
if #graph
#graph.series[0].data = data.points
#graph.render()
node = $(#node)
value = parseInt data.points[data.points.length - 1].y
cool = parseInt node.data "cool"
warm = parseInt node.data "warm"
level = switch
when value <= cool then 0
when value >= warm then 4
else
bucketSize = (warm - cool) / 3 # Total # of colours in middle
Math.ceil (value - cool) / bucketSize
backgroundClass = "hotness#{level}"
lastClass = #get "lastClass"
node.toggleClass "#{lastClass} #{backgroundClass}"
#set "lastClass", backgroundClass
Can anyone help me understand why my graph does not want to show any previous values of X?
I think your issue is the call to today = new Date() in function format. The formatter is getting a date passed in by Rickshaw/D3, the date just needs to be formatted according to your needs. By calling today = new Date(), you are ignoring the passed in date and instead providing your own/new date.
Side note: you can take a look at D3's date/time formatting or moment.js for simpler date/time formatting, so your format function could shrink to 1 or 2 lines of code.
I am trying to use this in a project, but I cannot figure out how to place a touch event listener to each of the icons/objects in the carousel, If someone could provide a quick answer of how to do that I'd appreciate it.
local NUM_ITEMS=20;
local radiusX= 200;
local radiusY= 40;
local centerX = 240;
local centerY = 160;
local speed = 0.05;
local perspective = 3;
local carousel = display.newGroup()
local icons = {}
local function zSort(myTable, myGroup)
table.sort(myTable,
function(a, b)
return a.depth < b.depth -- depth is your custom field
end
)
for i = 1, #myTable do
myGroup:insert(myTable[i].img)
end
end
function Icon(i)
local this = {}
local icon = display.newImage(carousel, "images/icon"..i..".png")
this.angle = (i-1) * math.rad(360/NUM_ITEMS);
this.img = icon
return this
end
function update(event)
local icon
local sin = math.sin
local cos = math.cos
for i=1, NUM_ITEMS, 1 do
icon = icons[i]
local img = icon.img
img.x = cos(icon.angle) * radiusX + centerX
img.y = sin(icon.angle) * radiusY + centerY
local s = (img.y - perspective) / (centerX + radiusY - perspective)
img.xScale = s*0.25
img.yScale = s*0.25
icon.angle = (icon.angle + speed) --%math.rad(360)
icon.depth = s
end
zSort(icons, carousel)
end
for i=1, NUM_ITEMS, 1 do
local icon = Icon(i)
icons[i] = icon
end
function onTouch(event)
if(event.phase=="moved") then
speed = (event.x - centerX) / 2000;
end
end
Runtime:addEventListener("enterFrame",update)
Runtime:addEventListener("touch", onTouch)
I can't exactly understood what you really need. But if you want to add individual touch to all same icons in a localGroup, then you can add the icons as an icon array and give specific tag to each and can give individual touch, as follows:
local icons = {}
for i=1,10 do
icons[i] = display.newImage(i..".png")
icons[i].tag = i
end
local function touchIt(e)
print(e.target.tag)
--[[ icons[e.target.tag] can be used to identify
and set properties to the touched icon --]]
end
for i=1,10 do
icons[i]:addEventListener("touch",touchIt)
end
OR
if you want to identify all group elements as the same and give touch, then you can use same tag/ give userdata to all icons and can give same touch action to all group elements(as follows).
local icons = {}
for i=1,10 do
icons[i] = display.newImage(i..".png")
icons[i].tag = 1 --[[ you can also use icons[i].userdata = "icons"
(or any string)--]]
end
local function touchIt(e)
print(e.target.tag) -- It willo be 1 for all icons
--[[ icons[e.target.tag] can be used to identify
whether if it is under 'icons' --]]
--[[ or use userdata as follows --]]
print(e.target.userdata)--[[ out put is a string
identifying the group/element--]]
end
for i=1,10 do
icons[i]:addEventListener("touch",touchIt)
end