Appcelerator를 사용하여 UI 요소의 중심을 위/왼쪽에서 가운데로 변경하는 방법은 무엇입니까?

Question

다음과 같은 기능이있는 슬라이더가 있으며 원보기의 반경을 줄여야합니다. 반경 변경은 작동하지만 왼쪽/위쪽 위치가 "가운데"이고 고정되어 변경되지 않으므로 레이블/원이 오른쪽으로 "이동"합니다.

레이블의 가운데 위치가 왼쪽/위 모서리가 아닌 동일하게 유지되도록 어떻게 변경할 수 있습니까? anchorPoint, animatedCenter 및 center를 시도했지만 표시 효과가 없습니다. 지금 나는 슬라이더가 반지름의 변화를 트리거하고 있기 때문에 애니메이션을 가지고 있지 않습니다.

function showRadar(e){ 
    //$.radarIcon.anchorPoint = {x:0.5, y:0.5}; //no effect 
    //$.radarIcon.animatedCenter = {x:0.5, y:0.5}; //no effect 
    $.radarIcon.height = e.source.value; 
    $.radarIcon.width = e.source.value; 
    $.radarIcon.borderRadius = e.source.value/2; 
    $.radarIcon.center = {x:30, y:400}; //no effect 
} 

Answer 1

그냥 다른 관점에서 원 포장 :

이 Index.xml

<Alloy> 
    <Window> 
     <View id="container"> 
      <View id="circle"/> 
      <Label id="lbl" text="test"/> 
     </View> 
    </Window> 
</Alloy> 

index.tss

"Window" : { 
    backgroundColor: "white" 
} 
"Label" : { 
    width: Ti.UI.SIZE, 
    height: Ti.UI.SIZE, 
    color: "#000" 
} 

"#circle" : { 
    width: 100, 
    height: 100, 
    borderRadius: 50, 
    backgroundColor: "red" 
} 
"#container" : { 
    width: 200, 
    height: 200 
} 

하는 index.js

function showRadar(e) { 
    $.circle.height = e; 
    $.circle.width = e; 
    $.circle.borderRadius = e/2; 
} 

var i = 100; 

$.circle.addEventListener("click", function() { 
    showRadar(i); 
    if (i < 200) { 
     i += 20; 
    } 
}) 
$.index.open(); 

을

원을 클릭하면 크기가 커지고 텍스트는 여전히 가운데에 배치됩니다. 외부 컨테이너의 최대 너비를 200으로 설정 했으므로 더 커지지 않습니다.