When using the USDZ Exporter component, how can I customise the ‘Open in Quick Look’ button that appears at the bottom of the screen on iOS?
by user 103054507105067008
When using the USDZ Exporter component, how can I customise the ‘Open in Quick Look’ button that appears at the bottom of the screen on iOS?
by user 103054507105067008
It seems a similar question got stale last time
This is the code that creates the button.
It looks like there’s a css class called quicklook-ar-button
that is being used.
For reference for others, this is a the solution how to override the button element:
Let me know @ROBYER1 if that was the name of the css class you’ve been looking for
So I got further with this, I made my own version of the USDZExporter script here but I get the error undefined is not a function (near 'exporter.parse...'
when I press the quick look button on iOS
by user 103054507105067008
That is how I hid the button programmatically, I can probably reverse engineer it to edit how the button looks
by user 103054507105067008
Hm, can’t find any meantion of the class anywhere.
this.dispatchEvent(new CustomEvent("created-button", { detail: button }))
This line is intersting, so you are able to liste on USDZ Exporter for created-button
and handle the button from that No need to querry it manually at least.
uph, the USDZ Exporter is not exposed. You can’t exactly clone it like you do, usually it just cases more issues which you can’t solve.
~~But since it is not exposed, you can’t listen to the dispatch i point out above ~~
And regardless, the workflow should be the same as for the other buttons, so it should be driven by a css class. Marcel/Herbst will have to answer this one
Hi @ROBYER1 yes what @kipash proposed here would be the way to go right now.
You can either customize the button styles directly or inject a stylesheet in the same element/parent by listening to created-button
on the USDZExporter component (myUsdzExporter.addEventListener(new CustomEvent("created-button", myEvt))
)
The reason for why you can’t modify it via a global css script is that it’s inside the shadowDom which prevents styles from leaking in/out of the element. The plan is to make it easier to still style an element again without requiring code but that’s not done yet
UsdzExporter is exposed/exported in @needle-tools/engine @kipash
My bad USDZExporter can be referenced and thus it is exposed.
import { USDZExporter } from "@needle-tools/engine";
You can also simply disable the built-in button (via the USDZExport component in Unity) and in your custom button click call GameObject.findObjectOfType(USDZExporter).exportAsync();
Thank you so much!
by user 103054507105067008