항상 신세를지고 있습니다.
요 전날 Vuforia Studio를 사용하여 뷰어 (Vuforia View)에서 볼 수있는 AR 경험을 만들 수있었습니다.
시도해 보면 여러가지 할 수 있었으므로, 향후의 힌트가 되면(자)라고 생각 메모를 남깁니다.

소개

사용한 환경은 다음과 같습니다.

Vuforia Studio : Version 8.4.7 (8.4.7.4459)

Vuforia View : Version 8.4.60(1729)

iPad Pro (10.5 inch)

알다시피

Vuforia Studio의 모바일용 AR 콘텐츠에서는 Ionic framework 1.3.3의 기능을 사용하여 장식을 변경할 수 있었습니다.
예를 들어, 버튼의 Text를 문자가 아닌 아이콘으로 표현하고 싶다고 하는 경우는, Ionicons Cheatsheet에 있는 Classname을 Class에 기술하는 것만으로 OK였습니다.

Vuforia Studio 표준 버튼을 배치한 상태

※기본 버튼을 그대로 사용하면 이런 느낌입니다.

문자 대신 Ionic 아이콘 사용

※ion-beer를 추가하는 것으로 머그잔이 표시되고 iconBtn에서는 폰트 사이즈를 지정하고 있습니다.

Ionic으로 버튼의 색과 표현을 장식합니다.

※맥주는 블랙보다 라거를 좋아하는 사람도 있으므로 색도 바꿔 봅니다.
여기에서는 Ionic에서 준비되어 있는 button-energized로 색을, button-outline으로 윤곽선형의 버튼 스타일을 적용했습니다.

요약

색이라면 CSS를 스스로 써도 변경할 수 있습니다만, Ionic으로 정의되고 있는 내용을 Class로 지정하는 것만으로 변경할 수 있으면 편합니다.
아래의 링크에서 Ionic framework의 CSS Components를 참조하면 사용 가능한 샘플이 자세히 설명되어 있으므로 이해하기 쉽습니다.

준비된 아이콘이 마음에 들지 않는 경우 Image Widget을 사용하여 아이콘 이미지를 지정하는 손도 있습니다.
그 경우는 다음을 STYLES > Application에 기술해, Image Widget의 Class에 imgButton을 기술하면 버튼과 같은 움직임을 붙일 수가 있습니다.

/* 이미지를 호버했다/'
.imgButton:hover{
/투명도를 높이면 이미지의 색상이 얇아집니다./
opacity:0.5;
/링크를 호버했을 때의 커서로 한다./
cursor: pointer;
}
/이미지를 클릭 한 순간/
.imgButton:active{
/요소를 약간 아래로 내리는 것으로, 누른 느낌을 낸다./
/지금 있는 위치에서 상대적으로 3px아래에 배치한다. */
position: relative;
top: 3px;
}

링크

Ionic framework 문서 링크
h tps // 이오니 cf 라메를 rk. 이 m / cs / v1 / 오 r ゔ ぃ w / # cs s - s

Ionicon Cheatsheet 링크
htps // 이오니콘 s. 이 m / v1 / 치아 t ぇ t. HTML