文本输入的 Flex 可移动视图问题

Posted

技术标签:

【中文标题】文本输入的 Flex 可移动视图问题【英文标题】:Flex movable view issue with textinput 【发布时间】:2014-07-16 06:51:44 【问题描述】:

当用户将视图拖到除文本输入之外的任何位置时,我正在尝试使视图(包含文本输入)可移动。代码如下:

view.addEventListener(MouseEvent.MOUSE_DOWN, handleDown);
view.addEventListener(MouseEvent.MOUSE_UP, handleUp);`

和处理程序:

  private function handleDown(event:MouseEvent):void
     //move the view if anything else than input text and action is selected
     if (!event.target.hasOwnProperty("text") && !DragManager.isDragging) 
        this.startDrag();
     
  
  private function handleUp(event:MouseEvent):void
     this.stopDrag();
  

问题是,如果我尝试用鼠标在 textInput 中标记部分文本,我将再次移动视图。我该如何解决这个问题?

附:如果我不在 textInput 命中区域,我也尝试开始拖动:

   var point:Point = localToGlobal(new Point(mouseX, mouseY));
   if (!view.textInput.hitTestPoint(point.x, point.y))) 
        this.startDrag();
    

但它也不起作用(说我不在文本输入中,即使我在其中)。有什么想法吗?

【问题讨论】:

【参考方案1】:

您需要将此条件添加到handleDown函数中:

这是一个工作示例:

mc.addEventListener(MouseEvent.MOUSE_DOWN, handleDown);
mc.addEventListener(MouseEvent.MOUSE_UP, mouseUp);

function handleDown(event:MouseEvent):void
//move the view if anything else than input text and action is selected
  if (stage.focus != mc.textInput) 
    this.startDrag();
  


function mouseUp(e:Event):void

    mc.stopDrag();

【讨论】:

似乎对我不起作用。当我尝试用鼠标选择部分文本时,视图仍然会移动。出于某种原因,它仅在我第一次在没有文本的情况下按 textInput 中的某个位置时才起作用。【参考方案2】:
private function handleDown(event:MouseEvent):void
     //move the view if anything else than input text and action is selected
     if (!event.currentTarget.hasOwnProperty("text") && !DragManager.isDragging) 
        this.startDrag();
     
  
  private function handleUp(event:MouseEvent):void
     this.stopDrag();
  

【讨论】:

请澄清一下。如我所见,您仅将目标更改为 currentTarget。它们之间的区别在于目标是调度您当前正在处理的事件的目标。所以 currentTarget 改变了,目标没有改变,我看不出这种改变有什么帮助。【参考方案3】:

实际上对 event.parent.hasOwnProperty("text") 的检查解决了这个问题,因为当我点击文本时,目标是文本本身,而不是文本输入。

【讨论】:

【参考方案4】:

对不起,我没有正确理解问题。

这可能会有所帮助,如果您能负担得起额外的变量“isDraggable”。

private var isDraggable:Boolean = true;  // You can make any component non-draggable  

    view.textInput.addEventListener(MouseEvent.MOUSE_DOWN, handleTIDown);
    view.textInput.addEventListener(MouseEvent.MOUSE_OUT, handleTIOut);
    view.textInput.addEventListener(MouseEvent.MOUSE_UP, handleTIOut);        


    view.addEventListener(MouseEvent.MOUSE_DOWN, handleDown);
    view.addEventListener(MouseEvent.MOUSE_UP, handleUp);




 private function handleTIDown(event:MouseEvent):void
      isDraggable = false;

  
  private function handleTIOut(event:MouseEvent):void
     isDraggable = true;
  


 private function handleDown(event:MouseEvent):void
     //move the view if anything else than input text and action is selected
     if (isDraggable && !event.target.hasOwnProperty("text") && !DragManager.isDragging) 
        this.startDrag();
     
  
  private function handleUp(event:MouseEvent):void
     this.stopDrag();
  

【讨论】:

感谢您的建议,但这并不是我所需要的——请查看下面的选定答案:)

以上是关于文本输入的 Flex 可移动视图问题的主要内容,如果未能解决你的问题,请参考以下文章

Flex 在列表项的视图之间传递数据

如果键盘阻止了文本视图,则移动 UIView

Flex Mobile textInput 滚动文本滞后

向移动视图上的引导导航栏切换按钮添加文本提示

使用 UIPanGestureRecognizer 的可拖动视图中的操作元素导致视图移动

如何在地图视图 iphone 或 ipad 上获得可移动的图钉?