튜토리얼 (코치 마크) 오버레이 만들기.

Question

안녕하세요, 자습서를 통해 코치 마크를 만들려고합니다.

Main.java

public class Main extends Activity { 

    private Button button1; 
    private int x; 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_help_overlay); 
     button1 = (Button)findViewById(R.id.button1); 
     x = button1.getTop(); 


        showOverLay(); 

    } 

    private void showOverLay(){ 

     this.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); 
     final Dialog dialog = new Dialog(this, 0); 
     dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT)); 
     dialog.getWindow().setLayout(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT); 
     dialog.requestWindowFeature(Window.FEATURE_NO_TITLE); 

     dialog.setContentView(R.layout.overlay_view); 

     RelativeLayout layout = (RelativeLayout) dialog.findViewById(R.id.overlayLayout); 

     layout.setOnClickListener(new OnClickListener() { 

      @Override 
      public void onClick(View arg0) 
      { 
       Main.this.setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_SENSOR); 
       dialog.dismiss(); 

      } 

     }); 

     dialog.show(); 

    } 
} 

그러니까 기본적으로, 활동이 처음 시작될 때 showOverlay 메소드가 호출된다. 그것은 전체 화면을 차지하고 투명 배경을 가지고 제목을 가지고 대화 상자를 보여줍니다. overlay.xml은이 대화 상자의 레이아웃입니다.

내가하고 싶은 일은 텍스트보기의 위치를 ​​동적으로 조정하여 다른 장치 화면을 보완하는 것입니다. (미래에는 화살표를 사용하여 이미지보기를 추가하므로 사물을 가리키는 화살표가 이상 할 것입니다. 그들이 말하는 것을 가리 키지 마라).

양해 바랍니다. 나는 위의 이미지는 내가하고 싶은 것을 보여줍니다

API (8)을 대상으로 할 것이기 때문에 나는 showCaseView을 사용할 수 없습니다. "HEEEEEELP"라고 쓰여있는 텍스트보기를 단추 위로 약간 움직이십시오.

main_activity.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" > 
    <Button 
     android:id="@+id/button1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_centerHorizontal="true" 
     android:layout_marginBottom="96dp" 
     android:onClick="idk" 
     android:text="This Button" /> 
</RelativeLayout> 

overlay.xml

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="@null" 
    android:id="@+id/overlayLayout"> 

    <TextView 
     android:id="@+id/textView1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:text="HEEEEEEELP" 
     android:textColor="#FFFFFF" 
     android:textAppearance="?android:attr/textAppearanceLarge" /> 

</RelativeLayout> 

읽기 주셔서 감사합니다.

업데이트 2

내에서 OnCreate 방법은

@Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_help_overlay); 
     button1 = (Button)findViewById(R.id.button1); 
     button1.getViewTreeObserver().addOnPreDrawListener(new OnPreDrawListener() { 
      public boolean onPreDraw() { 
       top = button1.getTop(); 
       bottom = button1.getBottom(); 
       left = button1.getLeft(); 
       right = button1.getRight(); 
       showOverLay(); 
       button1.getViewTreeObserver().removeOnPreDrawListener(this); 
       return true; 
      } 
     }); 


    } 

지금 단추 1의 좌표에 액세스 할 수 있습니다. 그러나, 나는 다른 장치 크기를 수용 할 수있는 버튼 위에 텍스트보기를 배치하는 방법에 대해 확신이 서지 않습니다. 나는 setMargins 메서드의 매개 변수를 가지고 놀았지만 금액을 판단하기는 힘들었다. 몇 가지 조사를 해본 결과 레이아웃 매개 변수가있는 상대적 레이아웃을 사용하고 위와 같은 필드를 사용할 수 있다는 것을 알았지 만 의도 한대로 작동하지 않는 것 같습니다. 텍스트보기가 단추 위로 이동하지 않습니다.

내 코드.

RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams)textView.getLayoutParams(); 
lp.addRule(RelativeLayout.CENTER_HORIZONTAL, R.id.button1); 
lp.addRule(RelativeLayout.ABOVE, R.id.button1); 

textView.setLayoutParams(lp); 

내 overlay_view.xml은 상대적 레이아웃이되었습니다.

Answer 1

) (당신의 showOverlay의 메소드를 추가

TextView textView = (TextView) dialog.findViewById(R.id.textView1); 
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(
LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT); 
params.setMargins(0, 0, 0, x); 
textView.setLayoutParams(params); 

및 XML 파일에서이를 제거하기 :

android:layout_centerVertical="true" 

Answer 2

이것은 당신이해야 할 일이다 : 사실

button1.getViewTreeObserver().addOnPreDrawListener(new OnPreDrawListener() { 
    public boolean onPreDraw() { 
     button1.getViewTreeObserver().removeOnPreDrawListener(this); 
     x = button1.getTop(); 
     showOverLay(); 
     return true; 
    } 
}); 

onCreate()에서 x = button1.getTop();을 호출하면 단추보기가 아직 그려지지 않고 측정되지만, 그러므로 getTop의 값은 0입니다.이 것을 시험해보십시오.

Answer 3

오버레이에 Dialog를 사용하지 마십시오. 별도의 창이 필요할 수도 있습니다. 모든 콘텐츠 위에보기를 표시 할 수있는 콘텐츠를 만드세요. 콘텐츠보기는 이며 View 개체는 쉽게 추가 및 제거 할 수 있습니다.

그런 다음 getGlobalVisibleRect()을 사용하여 창에 다른 뷰 객체의 전역 사각형을 찾을 수 있습니다. 그런 다음 도움말 콘텐츠를이 사각형의 모든 측면에 맞 춥니 다.

Answer 4

레이아웃이 끝나면 UI 도면을 만들어야합니다. 레이아웃 드로잉 스레드에 Runnable 인터페이스를 연결하여이 작업을 수행 할 수 있습니다. 여백 또는 패딩을 계산할 때는보기를 만든 후에이 작업을 수행해야합니다. 참조 : onFinishInflate();

button1.post(new Runnable() { 
    x = button1.getTop(); 

    showOverLayout(); 
});