像耐心/克朗代克纸牌游戏一样拖动节点

2024-04-30

我正在做克朗代克游戏。逻辑一切正常。我只是在使用 javafx 中的 UI 时遇到问题。

我一直在尝试从“桌面堆”周围移动/拖动卡片,但没有达到预期的结果。 我的卡片是一个 ImageView,里面有一个图像。这些卡片位于窗格内:

Pane tableau = new Pane();
for (int i = 0; i < n; i++) {
    Image img = new Image("resources/images/" + (i + 1) + ".png");
    ImageView imgView = new ImageView(img);
    imgView.setY(i * 20);
    //imgView Mouse Events here
    tableau.getChildren().add(imgView);
}

I tried:

imgView.setOnMousePressed((MouseEvent mouseEvent) -> {
    dragDelta.x = imgView.getLayoutX() - mouseEvent.getSceneX();
    dragDelta.y = imgView.getLayoutY() - mouseEvent.getSceneY();
});
imgView.setOnMouseDragged((MouseEvent mouseEvent) -> {
    imgView.setLayoutX(mouseEvent.getSceneX() + dragDelta.x);
    imgView.setLayoutY(mouseEvent.getSceneY() + dragDelta.y);
});

这个解决方案不起作用,因为我设置了位置,所以当释放卡时,卡不会返回到原来的位置,并且因为卡与其他 UI 对象发生碰撞。

另一种尝试:

imgView.setOnDragDetected((MouseEvent event) -> {
    ClipboardContent content = new ClipboardContent();
    content.putImage(img);
    Dragboard db = imgView.startDragAndDrop(TransferMode.ANY);
    db.setDragView(img, 35, 50);
    db.setContent(content);
    event.consume();
});

在这个解决方案中,问题是:卡片是半透明的,就像移动文件一样,光标变得禁止/禁止,但除此之外它工作得很好:没有碰撞,如果我释放鼠标,卡片就会回到原来的位置。 另一个问题是我不知道用这个解决方案是否可以移动超过一张卡?

我的最后一个问题是,如何将一个节点(在本例中为 ImageView)或一组节点从一堆移动到另一堆,就像在纸牌游戏中一样?


要了解原始卡的位置,您应该使用设置翻译X http://docs.oracle.com/javafx/2/api/javafx/scene/Node.html#setTranslateX%28double%29(和 Y)而不是鼠标处理程序中的 setLayoutX 。因此,当用户释放卡片时,只需调用一个 Transition 即可让卡片飞回布局位置。如果用户将卡片释放到有效位置,则将平移坐标设置为 0 并更改布局位置或使用relocate http://docs.oracle.com/javafx/2/api/javafx/scene/Node.html#relocate%28double,%20double%29.

如果你想让卡片半透明,你可以G。改变opacity http://docs.oracle.com/javafx/2/api/javafx/scene/Node.html#setOpacity%28double%29或应用 CSS。

顺便说一句,我不会使用 Clipboardcontent,它似乎不适合您的需求。

您可以使用鼠标处理代码移动多个对象。您只需将平移同时应用到多个对象即可。当您拖动一堆卡片时,您可以确定所选卡片上方的卡片并将过渡应用到所有卡片。


下面是一个简单的示例,向您展示它的外观。

Card.java,您将使用 ImageView。

public class Card extends Rectangle {

    static Random rand = new Random();

    public Card() {


        setWidth(100);
        setHeight(200);

        Color color = createRandomColor();

        setStroke(color);
        setFill( color.deriveColor(1, 1, 1, 0.4));

    }

    public static Color createRandomColor() {

        int max = 200;

        Color color = Color.rgb( (int) (rand.nextDouble() * max), (int) (rand.nextDouble() * max), (int) (rand.nextDouble() * max));

        return color;
    }
}

Game.java,应用程序。

public class Game extends Application {

    static List<Card> cardList = new ArrayList<>();

    @Override
    public void start(Stage primaryStage) {

        MouseGestures mg = new MouseGestures();

        Group root = new Group();

        for( int i=0; i < 10; i++) {

            Card card = new Card();
            card.relocate( i * 20, i * 10);

            mg.makeDraggable(card);

            cardList.add( card);
        }

        root.getChildren().addAll( cardList);

        Scene scene = new Scene( root, 1600, 900);

        primaryStage.setScene( scene);
        primaryStage.show();

    }

    public static void main(String[] args) {
        launch(args);
    }

    // TODO: don't use a static method, I only added for the example 
    public static List<Card> getSelectedCards( Card currentCard) {

        List<Card> selectedCards = new ArrayList<>();

        int i = cardList.indexOf(currentCard);
        for( int j=i + 1; j < cardList.size(); j++) {
            selectedCards.add( cardList.get( j));
        }

        return selectedCards;
    }

}

MouseGestures.java,鼠标处理机制。

public class MouseGestures {

    final DragContext dragContext = new DragContext();

    public void makeDraggable(final Node node) {

        node.setOnMousePressed(onMousePressedEventHandler);
        node.setOnMouseDragged(onMouseDraggedEventHandler);
        node.setOnMouseReleased(onMouseReleasedEventHandler);

    }

    EventHandler<MouseEvent> onMousePressedEventHandler = new EventHandler<MouseEvent>() {

        @Override
        public void handle(MouseEvent event) {

            dragContext.x = event.getSceneX();
            dragContext.y = event.getSceneY();

        }
    };

    EventHandler<MouseEvent> onMouseDraggedEventHandler = new EventHandler<MouseEvent>() {

        @Override
        public void handle(MouseEvent event) {

            Node node = (Node) event.getSource();

            double offsetX = event.getSceneX() - dragContext.x;
            double offsetY = event.getSceneY() - dragContext.y;

            node.setTranslateX(offsetX);
            node.setTranslateY(offsetY);

            // same for the other cards
            List<Card> list = Game.getSelectedCards( (Card) node);
            for( Card card: list) {
                card.setTranslateX(offsetX);
                card.setTranslateY(offsetY);
            }


        }
    };

    EventHandler<MouseEvent> onMouseReleasedEventHandler = new EventHandler<MouseEvent>() {

        @Override
        public void handle(MouseEvent event) {

            Node node = (Node) event.getSource();

            moveToSource(node);

            // same for the other cards
            List<Card> list = Game.getSelectedCards( (Card) node);
            for( Card card: list) {
                moveToSource(card);
            }

            // if you find out that the cards are on a valid position, you need to fix it, ie invoke relocate and set the translation to 0
            // fixPosition( node);

        }
    };

    private void moveToSource( Node node) {
        double sourceX = node.getLayoutX() + node.getTranslateX();
        double sourceY = node.getLayoutY() + node.getTranslateY();

        double targetX = node.getLayoutX();
        double targetY = node.getLayoutY();

        Path path = new Path();
        path.getElements().add(new MoveToAbs( node, sourceX, sourceY));
        path.getElements().add(new LineToAbs( node, targetX, targetY));

        PathTransition pathTransition = new PathTransition();
        pathTransition.setDuration(Duration.millis(1000));
        pathTransition.setNode(node);
        pathTransition.setPath(path);
        pathTransition.setCycleCount(1);
        pathTransition.setAutoReverse(true);

        pathTransition.play();
    }

    /**
     * Relocate card to current position and set translate to 0.
     * @param node
     */
    private void fixPosition( Node node) {

        double x = node.getTranslateX();
        double y = node.getTranslateY();

        node.relocate(node.getLayoutX() + x, node.getLayoutY() + y);

        node.setTranslateX(0);
        node.setTranslateY(0);

    }

    class DragContext {

        double x;
        double y;

    }

    // pathtransition works with the center of the node => we need to consider that
    public static class MoveToAbs extends MoveTo {

        public MoveToAbs( Node node, double x, double y) {
            super( x - node.getLayoutX() + node.getLayoutBounds().getWidth() / 2, y - node.getLayoutY() + node.getLayoutBounds().getHeight() / 2);

        }

    }

    // pathtransition works with the center of the node => we need to consider that
    public static class LineToAbs extends LineTo {

        public LineToAbs( Node node, double x, double y) {
            super( x - node.getLayoutX() + node.getLayoutBounds().getWidth() / 2, y - node.getLayoutY() + node.getLayoutBounds().getHeight() / 2);
        }

    }

}

当您选择一张或多张卡牌时,它们会恢复到原来的位置。

这是我从顶部拖动第三张卡的屏幕截图。

当您检查卡是否位于有效目的地时,您应该调用 fixPosition 方法。它只是重新定位卡,即。 e.使用平移值计算位置,重新定位节点并将其平移设置为 0。

棘手的部分是 PathTransition。它从节点的中心开始工作,而不是从 x/y 坐标开始。Here's https://stackoverflow.com/questions/27659474/create-a-path-transition-with-absolute-coordinates-for-a-stackpane-object/27729231#27729231如果您想了解更多信息,我已回复了有关该问题的帖子。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

像耐心/克朗代克纸牌游戏一样拖动节点 的相关文章

  • 任务“:app:dexDebug”执行失败

    我目前正在处理我的项目 我决定将我的 Android Studio 更新到新版本 但在我导入项目后 它显示如下错误 Information Gradle tasks app assembleDebug app preBuild UP TO
  • 使用 Checkstyle Plugin 时从插件调用代码时出现问题:“org.eclipse.jface”

    我正在尝试在 Rational Software Architect 7 0 0 4 上使用 eclipse cs 插件 我最近卸载了旧的 beta2 版本并安装了 beta3 插件本身按照之前的配置工作 但是每当我尝试通过 Windows
  • 通过 InjectMocks Spy 注入对象

    我需要对一个类运行一系列单元测试 该类具有 Autowired Logger 实现 实现的基本思想是 Mock Logger logger InjectMocks TestedClass tested 但我想保存日志输出功能 Mockito
  • 有没有好的方法来解析用户代理字符串?

    我有一个Java接收模块User Agent来自最终用户浏览器的字符串的行为需要略有不同 具体取决于浏览器类型 浏览器版本甚至操作系统 例如 FireFox 7 0 Win7 Safari 3 2 iOS9 我明白了User Agent由于
  • Java 重写 hashCode() 得到 StackOverflowError

    所以我不太熟悉重写 hashCode 并且我似乎在 hashCode 方法中以某种方式进行了一些无限递归 这是我的场景 我有一个 DuplicateCache 类 它是一个缓存对象 用于检查系统中的重复对象 我有一个静态内部类 Duplic
  • 如何将 Spotlight for Help 插入本地化的 macOS 应用程序?

    我正在 macOS 上使用 Swing GUI 框架实现 Java 应用程序 当使用system外观和感觉以及screen菜单栏 Swing 自动插入一个搜索栏 called 聚光灯寻求帮助 https developer apple co
  • Java 变量的作用域

    我不明白为什么这段代码的输出是10 package uno public class A int x 10 A int x 12 new B public static void main String args int x 11 new
  • spring - 强制 @Autowired 字段的 cglib 代理

    我有混合堆栈 EJB 和 Spring 为了将 Spring 自动装配到 EJB 我使用SpringBeanAutowiringInterceptor 不确定这是否会影响我遇到的问题 在尝试通过以下方式自动装配 bean 时 Scope p
  • 如何将 XMP XML 块序列化为现有的 JPEG 图像?

    我有许多 JPEG 图像 其中包含损坏的 XMP XML 块 我可以轻松修复这些块 但我不确定如何将 固定 数据写回图像文件 我目前正在使用 JAVA 但我愿意接受任何能让这项任务变得容易的事情 这是目标关于 XMP XML 的另一个问题
  • 所有junit测试后的清理

    在我的项目中 我必须在所有测试之前进行一些存储库设置 这是使用一些棘手的静态规则来完成的 然而 在所有测试之后我不知道如何进行清理 我不想保留一些神奇的静态数字来引用所有测试方法的数量 我应该一直维护它 最受赞赏的方法是添加一些侦听器 该侦
  • Java:VM 如何在 32 位处理器上处理 64 位“long”

    JVM 如何在 32 位处理器上处理 64 位的原始 long 在多核 32 位机器上可以并行利用多个核心吗 64 位操作在 32 位机器上慢了多少 它可能使用多个核心来运行不同的线程 但不会并行使用它们进行 64 位计算 64 位长基本上
  • 参数动态时如何构建 JPQL 查询?

    我想知道是否有一个好的解决方案来构建基于过滤器的 JPQL 查询 我的查询太 富有表现力 我无法使用 Criteria 就像是 query Select from Ent if parameter null query WHERE fiel
  • 为什么 ConcurrentHashMap::putIfAbsent 比 ConcurrentHashMap::computeIfAbsent 更快?

    使用 ConcurrentHashMap 我发现computeIfAbsent 比putIfAbsent 慢两倍 这是简单的测试 import java util ArrayList import java util List import
  • 从 html 页面和 javascript 调用 java webservice

    我正在尝试从 javascript 调用 java 实现的 Web 服务 使用 NetBeans IDE 我读过很多关于 jQuery 和 AJAX 的内容 但我似乎无法掌握它 假设我的 Web 服务 WSDL 位于 http localh
  • 让JScrollPane控制多个组件

    对于我的应用程序 我正在设计一个脚本编辑器 目前我有一个JPanel其中包含另一个JPanel保存行号 位于左侧 以及JTextArea用于允许用户输入代码 位于右侧 目前 我已经实施了JScrollPane on the JTextAre
  • 将 RSA 密钥从 BigIntegers 转换为SubjectPublicKeyInfo 形式

    WARNING 最初的问题是关于 PKCS 1 编码密钥 而问题中的实际示例需要SubjectPublicKeyInfo X 509 编码密钥 我目前正致力于在 java 中从头开始实现 RSA 算法 特别是密钥生成方面 现在我的代码可以给
  • ExceptionHandler 不适用于 Throwable

    我们的应用程序是基于 Spring MVC 的 REST 应用程序 我正在尝试使用 ExceptionHandler 注释来处理所有错误和异常 I have ExceptionHandler Throwable class public R
  • struts 教程或示例

    我正在尝试在 Struts 中制作一个登录页面 这个想法是验证用户是否存在等 然后如果有错误 则返回到登录页面 错误显示为红色 典型的登录或任何表单页面验证 我想知道是否有人知道 Struts 中的错误管理教程 我正在专门寻找有关的教程 或
  • MongoDB Java 驱动程序:MongoCore 驱动程序与 MongoDB 驱动程序与 MongoDB 异步驱动程序

    MongoDB Java 驱动程序有三种不同的驱动程序选项 核心驱动 MongoDB 驱动程序 MongoDB 异步驱动程序 The 驱动程序描述页面 https docs mongodb org ecosystem drivers jav
  • Spring Boot MSSQL Kerberos 身份验证

    目前在我的春季靴子中application properties文件中 我指定以下行来连接到 MSSql 服务器 spring datasource url jdbc sqlserver localhost databaseName spr

随机推荐

  • 路由器解析器不渲染组件

    我有这个路由器解析器来从 Google Firestore 检索数据 我正在尝试使用解析器来提前获取数据 当我将调试器放置在解析函数中时 它会显示从服务器检索的数据 但它永远不会从resolve 方法返回 谁能帮我一下 路由模块 const
  • 使用 javascript 复制到所有浏览器的剪贴板

    我试图让 复制到剪贴板 适用于所有浏览器 但运气不好 我正在使用 javascript 但我不想使用零剪贴板 http zeroclipboard org to do 请让我们知道我的代码有什么问题 感谢您的帮助 下面是代码 目前我的代码仅
  • jQuery 创建多维数组

    我花了很长时间试图弄清楚如何在 jQuery 中创建多维数组 我在循环之外实例化数组 在循环内部我想添加数组元素 i 0 loop start
  • 在 C 中释放 NULL 指针是一个好习惯吗? [复制]

    这个问题在这里已经有答案了 可能的重复 ptr 为 NULL 的 free ptr 是否会损坏内存 https stackoverflow com questions 1938735 does freeptr where ptr is nu
  • Libsourcey 缺少 -fPIC 编译错误

    我正在尝试运行 LibSourcey 以使用 Webrtc 流服务器 问题是我似乎无法让它发挥作用 我努力在我的 Ubuntu 16 04 上 cmake 该项目 cmake 文件中的正则表达式 但现在它已修复 我实际上遇到的问题是编译时的
  • 基本身份验证:是否可以像 getRemoteUser() 一样设置RemoteUser

    您好 我正在使用基本身份验证方法来保护我的 Web 应用程序中的某些页面 其中有指定的 url 模式如下
  • 起订量中的匹配设置问题

    我过去一周左右一直在使用 Moq 直到今天才遇到任何问题 我在获取时遇到问题VerifyAll 以正确匹配我的模拟的设置 我目前正在为我的应用程序的 API 编写单元测试 该应用程序的结构如下 API lt gt Service lt gt
  • android 中的 onSensorChanged 在模拟器中不断触发

    我正在使用 ACCELEROMETER 传感器 并已通过相同的方式注册了一个侦听器 mSensorManager SensorManager getSystemService Context SENSOR SERVICE mAccelera
  • gradle - 从 url 下载并解压文件

    从 url 下载和解压文件的正确 gradle 方法是什么 http 如果可能的话 我想防止每次运行任务时重新下载 在ant get可以通过以下方式实现skipexisting true 我当前的解决方案是 task foo ant get
  • Xcode 4.x - 使其指向有问题的崩溃行

    每次 Xcode 崩溃时 它都会指向 main m 上的这一行 int retVal UIApplicationMain argc argv nil AppController 我知道 Xcode 4 调试与 3 x 相比很糟糕 但是我如何
  • 带有 CompletableFuture 的 MDC 记录器

    我正在使用 MDC Logger 除了一种情况外 它对我来说非常适合 无论我们在代码中的何处使用 CompletableFuture 对于创建的线程 MDC 数据都不会传递到下一个线程 因此日志会失败 例如 在代码中我使用下面的代码片段来创
  • 使用适用于 IE7 和 IE8 的 jQuery 在 Facebox 中加载 FLV

    不用说 这在 Chrome Firefox 和 Safari 中完美运行 IE 任何版本 都是问题所在 客观的 我正在尝试加载 JWplayer 它会在 Facebox 弹出窗口中加载来自 S3 的 FLV jQuery document
  • 创建一个能够从容器注册表中提取的 Docker 就绪计算引擎

    我们使用 terraform 设置 GCE 实例 然后使用 ansible playbooks 来配置它们并将我们的服务转移到机器上 我正在我们的组织中运行一个项目 该项目需要从另一个项目中提取 Docker 映像 这些图像托管在另一个项目
  • 使用 Mercurial,我如何查看哪些更改尚未推送?

    我习惯了 git 你可以在其中运行 gitk 并得到如下内容 在这里您可以看到有一些更改需要推送到远程分支 或者 我可以使用git log decorate输出将是 b8c2926 refs heads next Update instru
  • FlexUnit ANT 任务挂起

    我正在使用 ANT 任务在构建服务器上运行 FlexUnit 当我从 Flash Builder 4 运行 Flex 单元测试时 它工作正常 但是当从 ANT 运行时 它会打开默认播放器 在我的例子中是 FireFox 成功运行 FU 但永
  • iPhone文本框显示光标

    我正在为 iPhone 开发一个计算器 设计类似于这样 问题是我无法在文本字段中显示光标 因为输入是通过图像等按钮进行管理的 此外 textField comeFirstResponder 不起作用 因为它显示默认键盘 所以我尝试 text
  • 如何让第一个字母像报纸风格一样推入段落

    我创建了一些 CSS 来处理段落中的第一个字母 看起来也更大 如何使第一个字母向下并向左推 这样它就不会高于该行本身 并在需要时将其他行缩进到右侧 见附图 text article color 000 text article first
  • 错误:“连接被拒绝:连接。验证连接属性

    与主机 localhost 端口 1433 的 TCP IP 连接失败 错误 连接被拒绝 连接 验证连接属性 确保 SQL Server 实例正在主机上运行并接受端口上的 TCP IP 连接 确保到该端口的 TCP 连接未被防火墙阻止 我已
  • 在 PATH 中找不到程序“make”

    我在 Eclipse 中遇到 程序 make 未在 PATH 中找到 错误 我检查了路径变量 C cygwin bin JAVA HOME bin ANT HOME bin ANDROID SDK tools ANDROID SDK pla
  • 像耐心/克朗代克纸牌游戏一样拖动节点

    我正在做克朗代克游戏 逻辑一切正常 我只是在使用 javafx 中的 UI 时遇到问题 我一直在尝试从 桌面堆 周围移动 拖动卡片 但没有达到预期的结果 我的卡片是一个 ImageView 里面有一个图像 这些卡片位于窗格内 Pane ta