Как использовать графические элементы SVG с Apache Royale? - PullRequest
Новая
       24

Как использовать графические элементы SVG с Apache Royale?

1 голос
/ 23 сентября 2019

Фанат Flex, я только что открыл Apache RoyaleЯ знал о FalconJS, я думал, что это смерть, но нет, увидев Тур драгоценного камня, я очень рад его использовать.Спасибо всем авторам.Я немного играю с примерами, но я не знаю, как добавить графику SVG.Я пытался что-то вроде этого в <j:view>

<svg:Rect height="50" width="50" fill="#ff0000"/>

Но получил ошибку: 

Uncaught TypeError: cls is not a constructor
    at Function.org.apache.royale.utils.MXMLDataInterpreter.generateMXMLObject (MXMLDataInterpreter.js:58)

Может кто-нибудь дать мне пример рисования Rectangle ou Circle с рамкой и цветом фона?Используемая версия Royale: 0.9.4

Вот полный код: 

<j:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:j="library://ns.apache.org/royale/jewel"
               xmlns:js="library://ns.apache.org/royale/basic" 
               xmlns:local="*" xmlns:layouts="spark.layouts.*" xmlns:svg="library://ns.apache.org/royale/svg"
               >

    <j:initialView>
        <j:View>
                <svg:Rect height="50" width="50" fill="0xff0000"/>
        </j:View>
    </j:initialView>
</j:Application>

С наилучшими пожеланиями

Ответы [ 2 ]

1 голос
/ 24 сентября 2019

Вы также можете указать заливку без использования привязки (на которую я, вероятно, должен был ответить первым): 

<js:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:js="library://ns.apache.org/royale/basic" 
    xmlns:svg="library://ns.apache.org/royale/svg">
    <js:valuesImpl>
        <js:SimpleCSSValuesImpl />
    </js:valuesImpl>
    <js:initialView>
        <js:View width="100" height="100">
            <svg:Rect height="50" width="50">
                <svg:fill>
                    <js:SolidColor color="0xff0000"/>
                </svg:fill>
            </svg:Rect>
        </js:View>
    </js:initialView>
</js:Application>

Для круга (проверенная работа): 

<js:View width="100" height="100" >
        <svg:Ellipse height="10" width="10" x="50" y="50">
            <svg:stroke>
                <js:SolidColorStroke color="0xff0000" weight="1"/>
            </svg:stroke>
        </svg:Ellipse>
</js:View>

Но с использованием кругане работает (не уверен, что это ошибка или нет): 

<js:View width="100" height="100" >
        <svg:Circle height="10" width="10" x="50" y="50">
            <svg:stroke>
                <js:SolidColorStroke color="0xff0000" weight="1"/>
            </svg:stroke>
        </svg:Circle>
</js:View>
0 голосов
/ 24 сентября 2019

Да.Вы должны быть в состоянии использовать его в MXML.Пространство имен должно быть библиотекой: //ns.apache.org/royale/svg (как у вас).Проблема в том, что вы используете значение int для заполнения, а не ссылку IFill.Нечто подобное должно работать, , но в реализации GraphicShape есть ошибка . 

    <js:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:js="library://ns.apache.org/royale/basic" 
               xmlns:svg="library://ns.apache.org/royale/svg"
               >
    <fx:Script>
        <![CDATA[
            import org.apache.royale.graphics.SolidColor;
            import org.apache.royale.graphics.IFill;

        [Bindable]public var fill:IFill = new SolidColor(0xff0000);
    ]]>
</fx:Script>
    <js:valuesImpl>
        <js:SimpleCSSValuesImpl />
    </js:valuesImpl>
    <js:beads>
        <js:ApplicationDataBinding />
    </js:beads>
    <js:initialView>
        <js:View width="100" height="100">
                <svg:Rect height="50" width="50" fill="{fill}"/>
        </js:View>
    </js:initialView>
</js:Application>

Пожалуйста, добавьте проблему с Github, и мы попытаемся исправить SVGреализация.https://github.com/apache/royale-asjs/issues

Я только что исправил это, и приведенный выше код теперь должен работать в следующей сборке Royale.https://github.com/apache/royale-asjs/issues/480

...