最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Get the pixel screen size in Spark AR studio (for Facebook) - Stack Overflow

programmeradmin3浏览0评论

I am starting to work with Spark AR studio and I looking for to get the screen size in pixel to pare the coordinate obtained by the gesture.location on Tap.

TouchGestures.onTap().subscribe((gesture) => {
  // ! The location is always specified in the screen coordinates
  Diagnostics.log(`Screen touch in pixel = { x:${gesture.location.x}, y: ${gesture.location.y} }`);

  // ????
});

The gesture.location is in pixel (screen coordinate) and would like to pare it with the screen size to determine which side of the screen is touched.

Maybe using the Camera.focalPlane could be a good idea...

Update

I tried two new things to have the screen size:

const CameraInfo = require('CameraInfo');
Diagnostics.log(CameraInfo.previewSize.height.pinLastValue());

const focalPlane = Scene.root.find('Camera').focalPlane;
Diagnostics.log(focalPlane.height.pinLastValue());

But both return 0

I am starting to work with Spark AR studio and I looking for to get the screen size in pixel to pare the coordinate obtained by the gesture.location on Tap.

TouchGestures.onTap().subscribe((gesture) => {
  // ! The location is always specified in the screen coordinates
  Diagnostics.log(`Screen touch in pixel = { x:${gesture.location.x}, y: ${gesture.location.y} }`);

  // ????
});

The gesture.location is in pixel (screen coordinate) and would like to pare it with the screen size to determine which side of the screen is touched.

Maybe using the Camera.focalPlane could be a good idea...

Update

I tried two new things to have the screen size:

const CameraInfo = require('CameraInfo');
Diagnostics.log(CameraInfo.previewSize.height.pinLastValue());

const focalPlane = Scene.root.find('Camera').focalPlane;
Diagnostics.log(focalPlane.height.pinLastValue());

But both return 0

Share Improve this question edited Jan 23, 2019 at 17:34 Jérémie Boulay asked Jan 4, 2019 at 17:06 Jérémie BoulayJérémie Boulay 3994 silver badges13 bronze badges 1
  • The CameraInfo.previewSize should work, but since it is a signal to debug it you should use something like this Diagnostics.watch("Width: ", CameraInfo.previewSize.width); – Tibor Udvari Commented Feb 2, 2024 at 14:37
Add a ment  | 

5 Answers 5

Reset to default 3

This answer might be a bit late but it might be a nice addition for people looking for a solution where the values can easily be used in script, I came across this code(not mine, forgot to save a link):

var screen_height = 0;
Scene.root.find('screenCanvas').bounds.height.monitor({fireOnInitialValue: true}).subscribe(function (height) {
    screen_height = height.newValue;
});
var screen_width = 0;
Scene.root.find('screenCanvas').bounds.width.monitor({fireOnInitialValue: true}).subscribe(function (width) {
    screen_width = width.newValue;
});

This worked well for me since I couldn't figure out how to use Diagnostics.log with the data instead of Diagnostics.watch.

Finally,

Using the Device Info in the Patch Editor and passing these to the script works!

First, add a variable "to script" in the editor:

Then, create that in patch editor:

And you can grab that with this script:

const Patches = require('Patches');
const screenSize = Patches.getPoint2DValue('screenSize');

My mistake was to use Diagnostic.log() to check if my variable worked well.

Instead use Diagnostic.watch():

Diagnostic.watch('screenSize.x', screenSize.x);
Diagnostic.watch('screenSize.y', screenSize.y);

Screen size is available via the Device Info patch output, after dragging it to patch editor from the Scene section.

Now in the open beta (as of this post) you can drag Device from the scene sidebar into the patch editor to get a patch that outputs screen size, screen scale, and safe area inserts as well as the self Object. The Device patch

The device size can be used in scripts using CameraInfo.previewSize.width and CameraInfo.previewSize.height respectively. For instance, if you wanted to get 2d points representing the min/max points on the screen, this'd do the trick.

const CameraInfo = require('CameraInfo')
const Reactive = require('Reactive')

const min = Reactive.point2d(
  Reactive.val(0),
  Reactive.val(0)
)
const max = Reactive.point2d(
  CameraInfo.previewSize.width,
  CameraInfo.previewSize.height
)

(The point I want to emphasize being that CameraInfo.previewSize.width and CameraInfo.previewSize.height are ScalarSignals, not number literals.)

Edit: Here's a link to the documentation: https://sparkar.facebook./ar-studio/learn/documentation/reference/classes/camerainfomodule

发布评论

评论列表(0)

  1. 暂无评论