UIBezierPath от Illustrator, Справочный координатный вопрос - PullRequest
Новая
       10

UIBezierPath от Illustrator, Справочный координатный вопрос

0 голосов
/ 28 сентября 2018

Я пытаюсь захватить векторные рисунки из Adobe Illustrator и преобразовать их в UIBezierPath.Я создал следующий javascript для преобразования выбранного пути в необходимый код Swift.JavaScript работает нормально, но рисунок в моем представлении XCode перевернут и смещен вправо.

В Adobe Illustrator я установил свою контрольную точку в центр, а свою линейку в центр Artboard.В Xcode я включил операторы let для регулировки горизонтального и вертикального положения.

Может ли кто-нибудь помочь с логикой для вычисления корректирующих значений для центрирования чертежа в представлении и создания изображения справавверх?

Векторный рисунок Adobe Illustrator:

Adobe Illustrator vector drawing

Код Javascript: 

// create a text file for the data
var file = File.saveDialog('Save a list of the path coordinates in UIBezierPath format.', 'Path values:*.txt');
file.open('w')
//path selection and point variables
var selection = app.activeDocument.selection ;
var item = selection[0]
var points = item.pathPoints;
var length = points.length;
var adjHorzPos = 0;
var adjVertPos = 0;

//select each path and write array to text file
for(i=0; i<length; i++)
    {
        if (i == 0) {
            //get the inital anchor points for starting move to values
            var anchorX = Math.floor(item.pathPoints[i].anchor[0] );
            var anchorY = Math.floor(item.pathPoints[i].anchor[1] );
            //write the let and move to code lines to file
            file.write("let adjHorzPos = " + adjHorzPos + "\nlet adjVertPos = " + adjVertPos + "\n\nlet drawing = UIBezierPath()\ndrawing.move(to: CGPoint(x: "+anchorX+" + adjHorzPos, y: "+anchorY+" + adjVertPos))\n");
        } else {
            //get the path points to make remaining addCurve code
            var ld0 = Math.floor(item.pathPoints[i].leftDirection[0] );
            var ld1 = Math.floor(item.pathPoints[i].leftDirection[1]);
            var a0 = Math.floor(item.pathPoints[i].anchor[0] );
            var a1 = Math.floor(item.pathPoints[i].anchor[1] );
            var rd0 = Math.floor(item.pathPoints[i-1].rightDirection[0] );
            var rd1 = Math.floor(item.pathPoints[i-1].rightDirection[1] );
            var str = "drawing.addCurve(to: CGPoint(x: "+a0+" + adjHorzPos, y: "+a1+" + adjVertPos), controlPoint1: CGPoint(x: "+rd0+" + adjHorzPos, y: "+rd1+" + adjVertPos), controlPoint2: CGPoint(x: "+ld0+" + adjHorzPos, y: "+ld1+" + adjVertPos))\n";
            //write addCurve to the file
            file.write(str);
        }
    } 
file.write("drawing.close()\n");
alert("Done!");

UIBezierPath в Xcode: 

let adjHorzPos = 0
let adjVertPos = 0
let drawing = UIBezierPath()
drawing.move(to: CGPoint(x: 305 + adjHorzPos, y: 281 + adjVertPos))
drawing.addCurve(to: CGPoint(x: 344 + adjHorzPos, y: 281 + adjVertPos), controlPoint1: CGPoint(x: 305 + adjHorzPos, y: 281 + adjVertPos), controlPoint2: CGPoint(x: 339 + adjHorzPos, y: 280 + adjVertPos))
drawing.addCurve(to: CGPoint(x: 353 + adjHorzPos, y: 289 + adjVertPos), controlPoint1: CGPoint(x: 348 + adjHorzPos, y: 281 + adjVertPos), controlPoint2: CGPoint(x: 352 + adjHorzPos, y: 286 + adjVertPos))
// …
drawing.addCurve(to: CGPoint(x: 267 + adjHorzPos, y: 281 + adjVertPos), controlPoint1: CGPoint(x: 259 + adjHorzPos, y: 286 + adjVertPos), controlPoint2: CGPoint(x: 263 + adjHorzPos, y: 281 + adjVertPos))
drawing.addCurve(to: CGPoint(x: 305 + adjHorzPos, y: 281 + adjVertPos), controlPoint1: CGPoint(x: 272 + adjHorzPos, y: 280 + adjVertPos), controlPoint2: CGPoint(x: 305 + adjHorzPos, y: 281 + adjVertPos))
drawing.close()

Xcode Посмотреть чертеж:

enter image description here

1 Ответ

0 голосов
/ 01 октября 2018

Спасибо, Рмадди, за подсказку.Похоже, что система координат Illustrator находится слева внизу (напротив iOS).Я инвертировал координаты Y в Javascript и изменил оператор let на центр представления.Теперь он выглядит как положено.

Пересмотренный код Javascript: 

if (i == 0) {
            //get the inital anchor points for starting move to values
            var anchorX = Math.floor(item.pathPoints[i].anchor[0] );
            var anchorY = -Math.floor(item.pathPoints[i].anchor[1] );
            //write the let and move to code lines to file
            file.write("let adjHorzPos = view.frame.width / 2\nlet adjVertPos = view.frame.height / 2\n\nlet drawing = UIBezierPath()\ndrawing.move(to: CGPoint(x: "+anchorX+" + adjHorzPos, y: "+anchorY+" + adjVertPos))\n");
        } else {
            //get the path points to make remaining addCurve code
            var ld0 = Math.floor(item.pathPoints[i].leftDirection[0] );
            var ld1 = -Math.floor(item.pathPoints[i].leftDirection[1]);
            var a0 = Math.floor(item.pathPoints[i].anchor[0] );
            var a1 = -Math.floor(item.pathPoints[i].anchor[1] );
            var rd0 = Math.floor(item.pathPoints[i-1].rightDirection[0] );
            var rd1 = -Math.floor(item.pathPoints[i-1].rightDirection[1] );
            var str = "drawing.addCurve(to: CGPoint(x: "+a0+" + adjHorzPos, y: "+a1+" + adjVertPos), controlPoint1: CGPoint(x: "+rd0+" + adjHorzPos, y: "+rd1+" + adjVertPos), controlPoint2: CGPoint(x: "+ld0+" + adjHorzPos, y: "+ld1+" + adjVertPos))\n";
            //write addCurve to the file
            file.write(str);
        }

enter image description here

...