Как создать Путь в JavaFX из образа SVG?

2

Я попытался создать путь из SVG-изображения, чтобы использовать его в своем приложении JavaFX. Я последовал за Jorn Hameister Guide, но одна вещь, которую я не мог понять, это то, что на самом деле вводить в качестве SVG Path.

package org.hameister.javafx.svg;

import javafx.animation.PathTransition;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.Pane;
import javafx.scene.shape.Path;
import javafx.stage.Stage;
import javafx.util.Duration;

import org.apache.batik.parser.PathParser;

/**
 * The alien icon:
 * http://commons.wikimedia.org/wiki/File:Smiley_green_alien_gun.svg
 *
 * @author hameister
 */
public class JavaFXAlienRallye extends Application {

    private final static double WIDTH = 650;
    private final static double HEIGHT = 500;

    @Override
    public void start(Stage primaryStage) {
        Pane root = new Pane();

        // Parse the SVG Path with Apache Batik and create a Path
        PathParser parser = new PathParser();
        JavaFXPathElementHandler handler = new JavaFXPathElementHandler("track");
        parser.setPathHandler(handler);
        parser.parse("M 150 50 L 550,50 A 50 50 0 0 1 600,100 L 600,350 A 50 50 0 0 1 550,400 L 400,400 A 50 50 0 0 1 350,350 L 350,300 A 50 50 0 0 0 300,250 L 250,250 A 50 50 0 0 0 200,300 L 200,450 A 50,50 0 0 1 150,500 A 50 50 0 0 1 100,450 L 100,100 A 50 50 0 0 1 150,50 z");


        Path path = handler.getPath();
        root.getChildren().add(path);

        // Moving image
        ImageView alien = new ImageView(new Image("green_alien.png"));
        alien.setScaleX(0.3);
        alien.setScaleY(0.3);
        root.getChildren().add(alien);

        // Path Transition
        PathTransition pathTransition = new PathTransition();
        pathTransition.setDuration(Duration.seconds(30));
        pathTransition.setPath(path);
        pathTransition.setNode(alien);
        pathTransition.setOrientation(PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
        pathTransition.setCycleCount(Timeline.INDEFINITE);
        pathTransition.play();

        primaryStage.setTitle("JavaFX Alien Rallye");
        primaryStage.setScene(new Scene(root, WIDTH, HEIGHT));
        primaryStage.getScene().getStylesheets().add("alien");
        primaryStage.show();
    }


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

Изображение, которое я попытался проанализировать в объекте пути JavaFX: Изображение

Я использовал это как путь (честно говоря, я понятия не имею, что вводить для пути):

"m798.80662,662.98805c0,0 -16.03157,-6.2936 -30.82085,-7.85875c-8.21125,-0.869 -21.55367,-1.6813 -29.14527,-8.13374c-7.5916,-6.45244 -6.65146,-15.24383 -5.40193,-20.56951c1.38985,-5.92377 5.76714,-9.70222 10.15625,-12.89062c5.71085,-4.14855 14.07063,-5.77574 18.75,-12.10938c7.29771,-9.87762 6.97557,-11.80062 11.27928,-23.4375c3.44083,-9.30372 2.87127,-22.77436 2.89628,-32.90501c0.021,-8.49018 -1.60103,-19.56202 3.92939,-26.10507c1.7727,-2.09729 5.59896,-2.73437 7.42187,-3.51562c1.82291,-0.78125 9.2448,-1.5625 9.76563,-1.5625l67.40082,-9.92754"

Но это ошибка, которую я продолжаю получать:

Первый элемент пути не может быть относительным.

  • 0
    пожалуйста, создайте минимальный воспроизводимый пример
  • 0
    @RobertLongson Готово.
Показать ещё 1 комментарий
Теги:
svg
javafx
javafx-8

1 ответ

3
Лучший ответ

Просто используя SVGPath это работает, хотя начиная с нижнего регистра m означает, что движение первого движения относительное, что не делает такого смысла и требует, чтобы анализатор справился с этим. SVGPath похоже, имеет возможность справиться с таким сценарием, ваш код, похоже, имеет проблему с этим.

Поскольку SVGPath является частью JavaFX со второй версии, похоже, нет причин не использовать его в этом случае. Пример:

@Override
public void start(Stage primaryStage) {
    SVGPath path = new SVGPath();

    // path from part of https://commons.wikimedia.org/wiki/File:Monte_Carlo_Formula_1_track_map.svg
    path.setContent("m 207.65129,536.68637 c 8.87045,-24.50098 26.39974,-70.18108 36.17152,-89.75895 9.77178,-19.57788 6.98479,-15.77432 16.96935,-29.91965 9.98456,-14.14533 30.28218,-37.23551 39.74401,-49.1218 9.46184,-11.8863 11.74077,-14.36188 15.18311,-20.09529 3.44234,-5.73341 7.77799,-17.20603 11.16404,-21.88154 3.38605,-4.67551 6.01249,-7.00118 9.3778,-8.48468 3.36531,-1.4835 5.14045,-1.28812 8.48468,-0.44656 3.34423,0.84156 6.89747,4.23124 13.39686,7.145 6.4994,2.91375 8.09762,3.74402 16.07623,6.25186 7.97861,2.50784 82.29308,18.3393 110.74735,23.66778 28.45427,5.32848 37.36257,5.13382 59.8393,8.93124 22.47673,3.79742 44.58585,5.15957 69.66366,11.61061 25.07781,6.45104 59.82154,22.58817 80.38114,26.79371 20.5596,4.20554 21.35623,3.391 40.63714,4.01906 19.28091,0.62806 55.46159,-1.12252 76.36209,0.89312 20.9005,2.01564 32.02584,6.00066 51.35462,10.71749 19.32878,4.71683 43.24929,14.76317 63.41179,17.41592 20.1625,2.65275 38.75264,0.74654 54.48056,-1.78625 15.72792,-2.53279 27.58246,-6.12675 38.40436,-11.61061 10.8219,-5.48386 17.4432,-12.25774 23.6677,-20.09529 6.2245,-7.83755 9.961,-18.4396 12.0572,-27.24028 2.0962,-8.80068 2.5469,-17.31428 1.7862,-28.13339 -0.7607,-10.81911 -3.9372,-21.19409 -7.1449,-33.93871 -3.2077,-12.74462 -10.297,-24.754 -11.6106,-37.5112 -1.3136,-12.7572 0.4288,-27.44542 3.5725,-37.5112 3.1437,-10.06578 9.9071,-18.59624 14.2899,-23.66779 4.3828,-5.07155 6.0968,-8.95765 56.2668,-37.95776 50.1701,-29.00011 137.5767,-73.8709 151.3845,-79.041457 13.8078,-5.170556 14.5875,-5.886907 19.6488,-4.912182 5.0613,0.974725 9.1282,4.125402 12.5037,7.591553 3.3755,3.466146 5.3901,7.162526 7.145,12.503736 1.7549,5.34121 3.1869,12.64841 2.2328,19.20216 -0.9541,6.55375 -6.0311,12.39407 -8.0381,18.7556 -2.007,6.36153 -3.3788,11.18943 -4.0191,19.20216 -0.6403,8.01273 0.6021,18.82551 1.3397,28.57997 0.7376,9.75446 2.7528,22.75722 3.1259,29.91964 0.3731,7.16242 -1.0562,10.53324 -0.4466,14.28999 0.6096,3.75675 1.3095,5.74104 3.5726,8.03811 2.2631,2.29707 6.0124,3.12975 8.9312,3.12593 2.9188,-0.004 5.1263,-0.90246 7.5916,-2.67937 2.4653,-1.77691 3.8567,-5.16794 4.9121,-9.3778 1.0554,-4.20986 -0.5133,-8.17422 -2.6793,-15.62967 -2.166,-7.45545 -9.4583,-42.42393 -9.3778,-54.48055 0.081,-12.05662 1.1085,-10.62967 3.1259,-15.1831 2.0174,-4.55343 4.2425,-9.05118 8.4847,-11.61061 4.2422,-2.55943 8.7303,-2.13235 15.1831,-2.23281 6.4528,-0.10046 23.2212,2.67937 23.2212,2.67937 0,0 40.3846,10.41025 50.0149,15.62966 9.6303,5.21941 8.1814,5.02126 10.271,8.48468 2.0896,3.46342 2.2819,6.60039 2.2328,10.71749 -0.049,4.1171 -0.2598,6.00916 -3.126,13.39685 -2.8662,7.38769 -16.5228,29.47309 -16.5228,29.47309 l -100.9229,139.32732 c 0,0 -19.2171,27.78572 -29.4731,38.85089 -10.256,11.06517 -18.0852,18.08314 -31.2594,27.68684 -13.1742,9.6037 -31.5888,20.2281 -48.2287,28.57996 -16.6399,8.35186 -33.8873,15.62357 -51.3546,21.43497 -17.4673,5.8114 -29.0352,9.26674 -53.1408,13.39686 -24.1056,4.13012 -62.7853,7.07512 -91.54524,8.48467 -28.7599,1.40955 -55.90539,2.24013 -80.8277,0.44657 -24.92231,-1.79356 -38.67496,-4.35042 -68.32398,-10.27093 -29.64902,-5.92051 -105.96308,-28.62697 -108.9611,-27.24027 -2.99802,1.3867 -3.70106,1.63243 -5.80531,4.46561 -2.10425,2.83318 -2.9365,10.41153 -4.91218,12.9503 -1.97568,2.53877 -1.59351,1.97352 -4.46562,3.12593 -2.87211,1.15241 -23.98469,-3.80685 -30.36621,-7.14499 -6.38152,-3.33814 -6.32936,-5.26268 -8.93124,-8.03811 -2.60188,-2.77543 -3.74514,-6.24454 -6.69843,-8.48468 -2.95329,-2.24014 -78.5949,-25.90059 -78.5949,-25.90059 L 415.30258,378.60345 c 0,0 -15.84343,-3.35528 -21.43497,-3.12594 -5.59154,0.22934 -6.81206,0.55433 -11.61061,2.67937 -4.79855,2.12504 -16.07623,11.16405 -16.07623,11.16405 0,0 -18.14324,17.21745 -27.24027,28.1334 -9.09703,10.91595 -18.85403,25.50133 -26.79372,37.5112 -7.93969,12.00987 -13.92598,20.01152 -17.83074,28.06993 -3.90476,8.05841 -6.64184,20.26456 -7.36169,23.68638 -0.71985,3.42182 -2.49206,7.88355 -1.89461,19.38713 0.59745,11.50358 6.3165,18.22732 8.85462,24.25443 9.3145,18.79513 9.47407,24.02412 5.14204,42.81192 -1.5481,6.89363 -1.21146,7.50422 -4.72722,18.81363 -3.51575,11.30942 -33.98358,115.37935 -33.98358,115.37935 0,0 -2.16026,10.73875 -4.46562,13.39686 -2.30536,2.65811 -2.73959,2.24043 -6.25187,3.12594 -3.51228,0.88551 -10.47875,-0.14319 -14.73654,0.44656 -4.25779,0.58975 -7.48567,0.4494 -10.71749,2.67937 -3.23182,2.22997 -4.46656,4.53741 -7.14499,10.27092 -2.67843,5.73351 -5.17699,13.19992 -6.69843,24.56091 -1.52144,11.36099 -0.54716,29.53768 0,43.3165 0.54716,13.77882 0.55078,25.21129 3.12594,39.29745 2.57516,14.08616 8.14757,33.10131 12.95029,44.6562 4.80272,11.55489 8.94892,18.84082 13.84342,25.00746 4.8945,6.16664 10.79921,9.35946 13.84342,12.50374 3.04421,3.14428 3.47223,2.74254 4.91218,5.8053 1.43995,3.06276 2.10408,7.91456 2.23281,12.50374 0.12873,4.58918 -0.1506,11.37636 -1.78625,14.73654 -1.63565,3.36018 -1.94484,3.643 -5.35874,5.35874 -3.4139,1.71574 -4.83176,2.42124 -15.1831,2.23281 -10.35134,-0.18843 -33.33368,-6.3725 -45.99588,-8.48468 -12.6622,-2.11218 -23.28076,-1.40518 -29.91965,-4.46561 -6.63889,-3.06043 -7.9139,-4.79019 -10.27092,-8.93124 -2.35702,-4.14105 -2.86561,-9.55385 -2.67938,-14.73655 0.18623,-5.1827 2.91067,-10.63839 4.01906,-15.62966 1.10839,-4.99127 2.77965,-9.19567 2.67937,-14.28998 -0.10028,-5.09431 -1.30836,-6.16661 -3.57249,-15.62967 -2.26413,-9.46306 -7.03025,-23.68577 -8.37633,-36.66296 -1.34608,-12.9772 -2.14299,-15.26539 -1.00147,-36.5732 1.14152,-21.30781 4.56907,-71.39339 7.59155,-95.56425 3.02248,-24.17086 4.81691,-31.72144 7.14499,-43.76307 2.32808,-12.04163 2.5989,-12.70168 6.25187,-28.57996 3.65297,-15.87828 15.8843,-46.66998 25.45403,-74.12928 9.56973,-27.4593 8.54546,-28.63988 17.41591,-53.14086 z");
    path.setFill(null);
    path.setStroke(Color.RED);
    path.setStrokeWidth(5);

    Circle circle = new Circle(10, Color.BLUE);

    Pane root = new Pane(path, circle);
    root.setPadding(new Insets(40));

    PathTransition transition = new PathTransition(Duration.seconds(10), path, circle);
    transition.setCycleCount(Animation.INDEFINITE);
    transition.setInterpolator(Interpolator.LINEAR);
    transition.play();

    Scene scene = new Scene(root);

    primaryStage.setScene(scene);
    primaryStage.show();
}
Поделиться
  • 1
    Я уже нашел решение, но это намного лучшее решение, Круто!
  • 0
    На нижний регистр м в качестве первого элемента пути не означает , что первый шаг является относительным. Это все еще является абсолютным в соответствии со спецификацией SVG.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню