Android 앱용 투명 데모 화면을 어떻게 만드나요?

Android 앱용 투명 데모 화면을 어떻게 만드나요?

---

사용자가 내 애플리케이션을 처음 설치할 때만 실행되는 반투명 데모 화면을 만들려고합니다. Pulse News 앱의 예는 다음과 같습니다.

Galaxy Nexus

Nexus One

'탭하여 닫기'기능 대신 사용자가 투명한 데모 페이지 몇 개를 스 와이프 할 수 있기를 바랍니다.

첫 번째 시도로 ViewPagerIndicator 라이브러리 의 샘플을 수정했습니다 . 각 뷰 페이저의 조각 내 ImageViews에서 반투명 PNG를 사용했습니다. 그런 다음 내 '주요 활동'의 onCreate 메소드에서 '데모 활동'으로 이것을 시작했습니다.

문제 : '주요 활동'은 백그라운드에서 볼 수 없습니다. 대신 검은 색이었습니다. 여기 에서 해결책을 시도했지만 문제가 해결되지 않았습니다.

이와 같은 것을 만드는 데 더 나은 접근 방식이 있습니까? 아니면 올바른 길을 가고 있습니까?

또한 이것이 어떻게 구현되는지에 따라 다른 관련 질문이 있습니다. 배경의 특정 UI 구성 요소를 가리 키도록 텍스트와 화살표를 오버레이하려고합니다. 텍스트와 화살표가있는 PNG를 사용하면 다른 장치에서 제대로 확장되지 않을 수 있습니다. 즉, 화살표가 반드시 백그라운드에서 올바른 UI 구성 요소를 가리킬 필요는 없습니다. 이 문제도 해결할 수있는 방법이 있습니까?

감사!

첫 번째 시도에 대한 내 코드는 다음과 같습니다.

DemoActivity.java

public class DemoActivity extends FragmentActivity {
    DemoFragmentAdapter mAdapter;
    ViewPager mPager;
    PageIndicator mIndicator;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.demo_activity);

        mAdapter = new DemoFragmentAdapter(getSupportFragmentManager());

        mPager = (ViewPager)findViewById(R.id.pager);
        mPager.setAdapter(mAdapter);
        //mPager.setAlpha(0);

        UnderlinePageIndicator indicator = (UnderlinePageIndicator)findViewById(R.id.indicator);
        indicator.setViewPager(mPager);
        indicator.setFades(false);
        mIndicator = indicator;
    }

}

DemoFragmentAdapter.java

class DemoFragmentAdapter extends FragmentPagerAdapter {
    protected static final int[] CONTENT = new int[] { R.drawable.demo1, R.drawable.demo2, R.drawable.demo3, R.drawable.demo4};

    private int mCount = CONTENT.length;

    public DemoFragmentAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        return DemoFragment.newInstance(CONTENT[position % CONTENT.length]);
    }

    @Override
    public int getCount() {
        return mCount;
    }

    public void setCount(int count) {
        if (count > 0 && count <= 10) {
            mCount = count;
            notifyDataSetChanged();
        }
    } }

DemoFragment.java

public final class DemoFragment extends Fragment {
    private static final String KEY_CONTENT = "TestFragment:Content";

    public static DemoFragment newInstance(int content) {
        DemoFragment fragment = new DemoFragment();
        fragment.mContent = content;
        return fragment;
    }

    private int mContent;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        if ((savedInstanceState != null) && savedInstanceState.containsKey(KEY_CONTENT)) {
            mContent = savedInstanceState.getInt(KEY_CONTENT);
        }
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        ImageView image = new ImageView(getActivity());
        image.setBackgroundResource(mContent);

        LinearLayout layout = new LinearLayout(getActivity());
        layout.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT));
        layout.setGravity(Gravity.CENTER);
        layout.addView(image);

        return layout;
    }

    @Override
    public void onSaveInstanceState(Bundle outState) {
        super.onSaveInstanceState(outState);
        outState.putInt(KEY_CONTENT, mContent);
    }
}

---

데모 정보를 다른 활동에 넣고 다음 테마를 지정하십시오.

<style name="Transparent" parent="@android:style/Theme.NoTitleBar">
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowNoTitle">true</item>      
    <item name="android:backgroundDimEnabled">false</item>
</style>

ActionBarSherlock을 사용 parent하는 경우 @style/Theme.Sherlock.

이것은 당신에게 투명한 활동을 제공하므로 그 아래에서 활동을 볼 수 있습니다.

이제 반투명 배경도 원한다고 생각합니다.

투명 활동의 xml 레이아웃에 다음을 추가하십시오.

android:background="#aa000000" 

마지막 6 자리는 색상을 정의합니다. 000000은 검정색입니다.

처음 2 개는 불투명도를 정의합니다. 00은 100 % 투명하고 ff는 100 % 불투명합니다. 그러니 그 사이에서 무언가를 선택하십시오.

---

ShowcaseView를 보셨습니까? https://github.com/Espiandev/ShowcaseView .

이것을 사용하여 :

View showcasedView = findViewById(R.id.view_to_showcase);
ViewTarget target = new ViewTarget(showcasedView);
ShowcaseView.insertShowcaseView(target, this, R.string.showcase_title, R.string.showcase_details);

---

Pulse는 4 개의 ImageView와 4 개의 TextView와 함께 RelativeLayout을 사용하고 있습니다. 스크린 샷의 텍스트는 모두 고유 한 사용자 지정 글꼴이있는 TextView입니다.

Manifest에서 활동에 다음을 추가하십시오.

android : theme = "@ style / Theme.Transparent">

외부 RelativeLayout에 다음을 추가하십시오.

android : background = "# aa000000"

styles.xml 파일로 :

<style name="Theme.Transparent" parent="android:Theme">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowIsFloating">false</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>    

사용자 정의 글꼴을 프로그래밍하는 방법의 예는 다음에서 찾을 수 있습니다.

https://github.com/commonsguy/cw-android/tree/master/Fonts/FontSampler/

Hierarchy Viewer의 레이아웃은 다음과 같습니다 (빨간색 상자는 RelativeLayout 컨테이너입니다).

---

setContentView(R.layout.sample_main);
showOverLay();

private void showOverLay(){

    final Dialog dialog = new Dialog(context, android.R.style.Theme_Translucent_NoTitleBar);

    dialog.setContentView(R.layout.transparent);

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

    layout.setOnClickListener(new View.OnClickListener() {

        @Override

        public void onClick(View arg0) {

            dialog.dismiss();

        }

    });

    dialog.show();

}

---

이를 위해 기본 레이아웃의 맨 아래에 도움말 레이아웃을 만들어야합니다. 예 :( 구조)

<Parent layout>

<Layout 1>(Linear,Relative,....)
  Main layout
  your view...
</Layout 1>

<Layout help>
  set #70000000 as background of this layout 
  #70(transparent range can change) 000000(black)
  and height and width as fillparent
</Layout help>

</Parent layout>

---

기본 레이아웃을으로 래핑 RelativeLayout한 다음 다음과 같이 두 번째 레이아웃을 추가합니다.

<RelativeLayout
    .... >

    <LinearLayout
        .... >

        <!-- Contents of your main layout -->

    </LinearLayout>

    <LinearLayout
        ....
        android:background="#44000000" > <!-- This is alpha 68/255, black -->

        <!-- Contents of your overlay layout -->

    </LinearLayout>

</RelativeLayout>

오버레이 레이아웃이 XML 파일의 기본 레이아웃 아래에 있다고 생각합니다 (메모리가 제공되는 경우). 그런 다음 ViewFlipper이 두 번째 레이아웃 내에서 원하는대로 자신 만의 레이아웃을 만들 수 있습니다 .

---

새로운 활동을 만드십시오 (튜토리얼).

Go to your Activity's layout xml file (activity_tutorial). Under the parent layout, add "android:background= #000" and "android:alpha= "0.5"

<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
                
                
    tools:context=".Tutorial_Activity" 
    android:background="#000"
    android:alpha="0.5">
  ..................................................
  ....................................................
  .............................................
  ...............................................
  
  </RelativeLayout>

Now, go to application manifest file and under your tutorial activity add attribute android:theme="@android:style/Theme.Translucent.NoTitleBar">

<application>
 .........................................
..........................................
....................................
..........................................

<activity
            android:name="com.aird.airdictionary.Tutorial_Activity"
            android:label="@string/title_activity_tutorial"
            
          android:theme="@android:style/Theme.Translucent.NoTitleBar">
  
        </activity>
    </application>

</manifest>

Thats it, now run this activity on top of any other activity and you can get the desired results. Customize, add text, imageviews and other stuff to get your desired tutorial screen. Pretty sure that you can make a viewpager work with this technique.

---

You could just check out the Android launcher code, as they do it. I do not know there implementation.

나라면 (단순한 오버레이라면) 응용 프로그램의 레이아웃을 망가 뜨리지 않고 오버레이 레이아웃을 만들고 활동에 직접 추가하여 응용 프로그램 레이아웃 위에 첨부 할 것 WindowManager입니다. 추가로 간단하게 될 수 있을까 ImageView받는 것은 WindowManager, 온 감각을 수신 ImageView하거나 제거 할 수있는 시간 제한이 ImageView당신으로부터를 Window.

참고 URL : https://stackoverflow.com/questions/12013334/how-do-you-create-a-transparent-demo-screen-for-an-android-app