Flash AS3 画线显示文本

Posted

技术标签:

【中文标题】Flash AS3 画线显示文本【英文标题】:Flash AS3 drawline displays text 【发布时间】:2016-12-21 20:20:05 【问题描述】:

我目前正在研究列线图,我能够创建 2 个与一条线相连的滑块,但是有没有办法让这条线读取中间数字,就像下面的示例一样。

我需要这条线来显示“距离”的多个数字。

还可以让滑块以不同的度量单位(例如米/英尺)显示多个数字

选项 2

是否可以让 line.graphic 每次通过它时播放一个影片剪辑或按钮夸大其词?

到目前为止,我正在考虑使用一种敌人类,所以每当 line.graphic 通过它时,它就会显示数字。

example nomograph

这是我目前所拥有的...对于滑块,我将一个影片剪辑“imageholder1”放在另一个影片剪辑“rect”的顶部

var imgWidth:Number = imageHolder1.width;
var imgHeight:Number = imageHolder1.height;
var rectWidth:Number = rect.width;
var rectHeight:Number = rect.height;
var rectX:Number = rect.x;
var rectY:Number = rect.y;
var img1Width:Number = imageHolder2.width;
var img1Height:Number = imageHolder2.height;
var rect1Width:Number = rect1.width;
var rect1Height:Number = rect1.height;
var rect1X:Number = rect1.x;
var rect1Y:Number = rect1.y;
// Do math to correctly make the drag bounds using values attained above
var boundWidth = rectWidth - imgWidth;
var boundHeight = rectHeight - imgHeight;
var bound1Width = rect1Width - img1Width;
var bound1Height = rect1Height - img1Height;

var line:MovieClip = new MovieClip();
addChild(line);

draw(null);

imageHolder1.width = txtout.width
imageHolder1.minimum = 0;
imageHolder1.maximum = 100;
imageHolder1.value = 100;
imageHolder1.snapInterval = 2;

var sliderValues:uint = imageHolder1.y;
imageHolder1.addEventListener(Event.CHANGE, sliderChanged);
function sliderChanged(evt:Event):void 
sliderValues = imageHolder1.value/100;
txtout.text = (imageHolder1.value/100).toFixed(2);

// Now apply the variable numbers with the math we want as bounds
var boundsRect:Rectangle = new Rectangle(rectX, rectY, 
boundWidth, boundHeight);
    // Enable drag
    imageHolder1.addEventListener(MouseEvent.MOUSE_DOWN, DragImage1);
    function DragImage1(event:MouseEvent) 
// Here you see we apply the boundsRect when they drag
imageHolder1.startDrag(false, boundsRect);
 stage.addEventListener(Event.ENTER_FRAME, draw);

// Stop drag
imageHolder1.addEventListener(MouseEvent.MOUSE_UP, DropImage1);
function DropImage1(event:MouseEvent) 
imageHolder1.stopDrag();
 stage.addEventListener(Event.ENTER_FRAME, draw);


 var bounds1Rect:Rectangle = new Rectangle(rect1X, rect1Y, 
bound1Width, bound1Height);
    // Enable drag
    imageHolder2.addEventListener(MouseEvent.MOUSE_DOWN, DragImage2);
    function DragImage2(event:MouseEvent) 
    // Here you see we apply the boundsRect when they drag
imageHolder2.startDrag(false, bounds1Rect);
     stage.addEventListener(Event.ENTER_FRAME, draw);

// Stop drag
imageHolder2.addEventListener(MouseEvent.MOUSE_UP, DropImage2);
function DropImage2(event:MouseEvent) 
    imageHolder2.stopDrag();
     stage.addEventListener(Event.ENTER_FRAME, draw);


function draw(event:Event):void
    line.graphics.clear();
    line.graphics.lineStyle(1,1);
    line.graphics.moveTo(imageHolder1.x,imageHolder1.y);
    line.graphics.lineTo(imageHolder2.x,imageHolder2.y);


var sliderValue:uint = imageHolder2.y;
addEventListener(Event.ENTER_FRAME, onEnterFrame);
function onEnterFrame(event:Event):void 
    sliderValue = imageHolder2.y;
    status_txt.text = "Slider position is: "+sliderValue;

更新

所以遇到了这个问题,我正在对其进行编辑以满足我的需要,并且我能够跟踪 flash 中的所有信息,并了解有关 xml to flash 的更多信息。

但我现在的问题是如何将它全部实现到 flash 阶段?

 <?xml version="1.0" encoding="utf-8"?>

<flow>
    <axis name="diameter" type="parallel" 
    scaleFunction="log(t)"> 
    <range>0.01,02, ,50</range> 
    <xposition>0.0</xposition> 
    <crop>0.032,0.977</crop> 
    <title>Diameter [in.]</title> 
    </axis>
    <axis name="weightFlow" type="parallel" 
    scaleFunction="log(t)"> 
    <range>0.001,100000</range> 
    <xposition>0.16</xposition> 
    <crop>0.127,0.941</crop> 
    <title>Weight Flow [1000 
    lb./hr.]</title> 
    </axis> 
    <axis name="massVelocity" 
    type="parallel" scaleFunction="log(t)"> 
    <range>1.0,10000</range> 
    <xposition>0.325</xposition> 
    <crop>0.091,0.91</crop> 
    <title>Mass Velocity 
    [lb./(hr.)(sq.ft.)]</title> 
    </axis> 
    <axis name="turning" type="turning"> 
    <xposition>0.48</xposition> 
    </axis> 
    <axis name="pressureDrop" 
    type="parallel" scaleFunction="log(t)"> 
    <range>0.000001,100</range> 
    <xposition>0.713</xposition> 
    <crop>0.175,0.902</crop> 
    <title>Pressure Drop 
    [lb./sq.in./ft.pipe]</title> 
    </axis> 
    <axis name="pressure" type="parallel" 
    scaleFunction="log(t)" layout="left"> 
    <range>0.001,100</range> 
    <xposition>1.0</xposition> 
    <title>Centipoises^0.16/(lb./cu.ft. 
    at 1 atm)</title> 
    </axis>
</flow>

【问题讨论】:

他们显示的公式“速度 x 时间 = 距离”有什么问题?此 link 向您展示了如何计算中间值。此外,这 link 可能会提供有关计算代码的线索。你有你的确切列线图的图像吗?我的意思是你的体重秤和那张照片一模一样吗? 要么巧妙地计算对数刻度,要么将缺口值放入您查询的数据库中。这意味着可能会创建 2 个数组。 Array-1 用于缺口的像素高度,Array-2 用于该高度(Y 位置)的缺口/比例值。然后检查链接线与距离刻度线相交的位置。该 Y-pos 是您在 Array-1 中检查的内容,当您找到具有该编号的最近数组槽时,它的索引将在 Array-2 中使用以获取比例值。 由于工作原因,我无法展示我的列线图……但我可以说左边的第一行是 Imp。 Gal, Litres, and US Gal 然后在中间有毫米和英寸 右边是米和英尺 但是该死的家伙,真的很感谢你帮助我,如果我能设置好,由于小数,计算对数刻度可能是最好的。在缺口值之间。除非有办法用数组获取缺口值之间的数字?我仍在学习 Flash,工作让我在这个项目上有点超出我的想象。 顺便说一句,使用@VC.One 所以我会收到通知。我在这里只是因为我想重新检查您的问题进度。不用担心图像共享。它看起来像这样 link 吗?如果是,那么它与您最初发布的“示例列线图”的逻辑非常不同。计算管道 直径 与流体 速率速度 的标准公式更容易 cos(此处不涉及船结 ;-))。今晚晚些时候(英国时间),我将尝试为您制作一个基本演示。 【参考方案1】:

此代码将向您展示如何根据“速率”和“速度”的指定数字计算“孔径”(中间值)。您可以更改inputNum_RateinputNum_Velo。例如,在该列线图 image 中,您可以看到它们的 流速 为 100 升/分钟,速度 为 4.5 米/秒。中间值应该在 22 毫米左右(或 0.85 到 0.89 英寸?)。尝试这两个公式来确定您认为哪个更适合您的项目。

这方面的行业标准公式很简单:

D = Q / V(其中D = 直径,Q = 流量,V = 速度)。

但是,为了与您的列线图图像紧密匹配,似乎这个其他公式效果更好:

Q = input_FlowRate x offset_of_Rate;V = input_Velocity x offset_of_Velocity; 结果 = Q / V;结果 = Math.sqrt(4 * 结果 / Math.PI);结果 *= 10; //# 毫米乘以 10

演示 - 通过代码测试数字: 启动一个新项目并将代码粘贴到 Actions 面板中,然后按 ctrl+enter 进行调试。 结果显示在调试器中(如果您看不到文本/反馈/输出,然后尝试按 F2)。

在代码部分“TEST APP”... 转到步骤(2) 并将inputNum_Rate = 100;inputNum_Velo = 4.5; 更改为您想要的任何单位(如列在您的列线图上)。

//# for: Define INPUT unit
var inputNum_Rate : Number = 0;     
var inputNum_Velo : Number = 0;

//# for: Define INPUT unit type (format)
var format_Rate : String = "ltr_pMin"; //set: "ltr_pMin" (Litres)or "gal_pMin" (Gallons)
var format_Diam : String = "mm"; //set: "mm" or "inches"
var format_Velo : String = "m_pSec"; //set: "m_pSec" (meters) or "ft_pSec" (feet)

var offset_Rate : Number = 16.66666666666666666; //Litres per Min
var offset_Velo : Number = 100.0; //Metres per Sec

var nvel : Number = 0;  var svel : Number = 0;
var nflow : Number = 0; var sflow : Number = 0;

var s : Number = 0;
var resultNum  : Number = 0; // holds the result

////////////// TEST APP /////////////////

//# 1) setup INPUT TYPE
format_Rate = "ltr_pMin"; //# Rate //set: "ltr_pMin" (Litres)or "gal_pMin" (Gallons)
format_Diam = "mm"; //# Diameter //set: "mm" or "inches"
format_Velo = "m_pSec"; //# Velocity //set: "m_pSec" (meters) or "ft_pSec" (feet)

//# 2) setup INPUT values ("Rate" & "Velocity" to get middle "Diameter");
inputNum_Rate = 100; inputNum_Velo = 4.5; //# These should be from input textbox

//# 3) calculate Diameter based on inputs of Rate & Velocity
resultNum = calculate_Diameter( inputNum_Rate, inputNum_Velo );
trace ("final :: resultNum : " + resultNum );

function calculate_Diameter( myRate:Number, myVelo:Number ) : Number

    //# RESET
    svel = nvel = nflow = sflow = s = resultNum = 0; //reset

    sflow = myRate * offset_Rate;
    svel = myVelo * offset_Velo;
    s = sflow/svel; //get Area
    s = Math.sqrt(4 * s / Math.PI);

    //# CONVERT
    s = s * 10;     s = Number(s.toPrecision(5));

    //# CHECK RESULTS IN DEBUGGER....
    trace("===========================================" );
    trace("\n FLOW RATE : " );
    //convert Litres and US gallons :: US-Gallons = ( litres / 3.79) || Litres = (3.79 * US-Gallons)
    trace("litres p/sec : " + ( myRate ) );
    trace("gallon p/sec : " + ( myRate / 3.79 ) );

    trace("\n BORE SIZE : " );
    //convert Mm and Inches :: (1 mm = 0.0393701 inch || 1 inch = 25.4 mm)
    trace("millms : " + (s) );
    trace("inches : " + (s * 0.0393701) );

    trace("\n VELOCITY : " );
    //convert Metres and Feet :: (1 metre= 3.28084 foot || 1 foot= 0.3048 metres)
    trace("m/sec  : " + ( myVelo ) );
    trace("ft/sec : " + ( myVelo * 3.28084 ) );
    trace("===========================================" );


    //# RETURN result of this function
    return resultNum;


【讨论】:

啊,谢谢,是的,都是肉汁和土豆泥,我发现一个更长更乏味的....通过一遍又一遍地复制和重命名相同的按钮...很满意,但它得到了工作完成了,但我肯定会玩这个……看看我能不能把它变成一本功能齐全的专着。谢谢你的帮助,说真的,如果可以的话,我想给你买个蛋糕什么的。

以上是关于Flash AS3 画线显示文本的主要内容,如果未能解决你的问题,请参考以下文章

Flash as3纺车

as3 文本字段更改字符串值

AS3.0中影片剪辑元件嵌套了个动态文本框,怎样才能在文本框上也能显示手型?

flash as3 图片展示将鼠标移到图片上就显示文字,然后再点击文字后移除并且显示下一张图片

Flash AS3 - textInput box @" 键盘字符问题

AS3 从 HTML 页面返回文本