আপনি কীভাবে কোনও অ্যান্ড্রয়েড অ্যাপের জন্য স্বচ্ছ ডেমো স্ক্রিন তৈরি করবেন?


105

আমি একটি আধা-স্বচ্ছ ডেমো স্ক্রিন তৈরি করার চেষ্টা করছি যা কোনও ব্যবহারকারী প্রথমবার আমার অ্যাপ্লিকেশন ইনস্টল করলেই চালু হয়। পালস নিউজ অ্যাপ্লিকেশন থেকে এখানে একটি উদাহরণ দেওয়া হয়েছে:

গ্যালাক্সি নেক্সাস

গ্যালাক্সি নেক্সাসে পালস নিউজ থেকে স্ক্রিনশটের উদাহরণ

নেক্সাস ওয়ান

এখানে চিত্র বর্ণনা লিখুন

একটি 'ট্যাপ-টু-খারিজ' বৈশিষ্ট্যটির পরিবর্তে, আমি চাই যে ব্যবহারকারী এই জাতীয় কয়েকটি স্বচ্ছ ডেমো পৃষ্ঠাগুলির মাধ্যমে সোয়াইপ করতে সক্ষম হন।

আমার প্রথম প্রয়াসের জন্য, আমি ভিউপিজারআইডিকেটর লাইব্রেরি থেকে একটি নমুনা পরিবর্তন করেছি । আমি ভিউ পেজারের প্রতিটি খণ্ডের ভিতরে ইমেজভিউগুলিতে আধা স্বচ্ছ পিএনজি ব্যবহার করেছি। তারপরে আমি আমার 'প্রধান ক্রিয়াকলাপ'-এর অনক্রিট পদ্ধতিতে এটি একটি' ডেমো ক্রিয়াকলাপ 'হিসাবে চালু করেছি।

সমস্যা: 'মূল ক্রিয়াকলাপ' পটভূমিতে দেখা যায়নি - পরিবর্তে এটি কেবল কালো ছিল। আমি এখানে সমাধানগুলি চেষ্টা করেছিলাম , তবে এটি সমস্যার সমাধান করেনি।

এই জাতীয় কিছু তৈরি করার জন্য কি আরও ভাল পদ্ধতির, বা আমি সঠিক পথে আছি?

আমার আরও একটি সম্পর্কিত প্রশ্ন ছিল যা এটি কীভাবে বাস্তবায়িত হয় তার উপর নির্ভর করে। আমি পাঠ্য এবং তীরগুলিকে ওভারলে করার চেষ্টা করছি যাতে তারা পটভূমিতে নির্দিষ্ট UI উপাদানগুলিতে নির্দেশ করে। পাঠ্য এবং তীরগুলি রয়েছে এমন কোনও পিএনজি ব্যবহার করে, সম্ভবত এটি বিভিন্ন ডিভাইসে সঠিকভাবে মাপবে না। অর্থাৎ, তীরগুলি অগত্যা পটভূমিতে সঠিক 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);
    }
}

আপনার কোডটি না দেখে কোনও পরামর্শ দেওয়া শক্ত। আপনি যদি আপনার ক্রিয়াকলাপের কোডটি রাখতে পারেন তবে এটি সাহায্য করতে পারে।
সায়াম

11
এটা একটা ভালো প্রশ্ন.
con_9

উত্তর:


79

আপনার ডেমো তথ্যকে একটি অন্য ক্রিয়াকলাপে রাখুন এবং নীচের থিমটি দিন।

<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>

আপনি যদি অ্যাকশনবারার্লক ব্যবহার করে থাকেন তবে এতে পরিবর্তন parentকরুন @style/Theme.Sherlock

এটি আপনাকে স্বচ্ছ ক্রিয়াকলাপ দেবে, সুতরাং আপনি নীচের ক্রিয়াকলাপটি দেখতে সক্ষম হবেন।

এখন আমি অনুমান করছি যে আপনিও একটি স্বচ্ছ ব্যাকগ্রাউন্ড চান।

এক্সএমএল লেআউটে (আপনার স্বচ্ছ ক্রিয়াকলাপের) যুক্ত করুন:

android:background="#aa000000" 

শেষ 6 টি সংখ্যা রঙ নির্ধারণ করে: 000000 কালো।

প্রথম 2 ধূমপানকে সংজ্ঞায়িত করে: 00 100% স্বচ্ছ, ff 100% অস্বচ্ছ। তাই এর মধ্যে কিছু বেছে নিন।


1
উত্তর করার জন্য ধন্যবাদ! অনেক পরীক্ষা এবং ত্রুটির পরেও আমি এটি শেষ করেছিলাম । আমি এখনও কৌতূহলী যে নাড়ি ডেমো স্ক্রিনটি বিভিন্ন স্ক্রিনের আকারে এমনকি সঠিক জায়গায় ওভারলেড সামগ্রীটি 'প্রতিস্থাপন' করতে সক্ষম - আপডেট হওয়া স্ক্রিনশটগুলি দেখুন। কোন ধারনা?
গৌতম

2
আপনার প্রথম ক্রিয়াকলাপে আপনি ( findViewById) নির্দেশ করতে চান এমন দৃশ্যটি সন্ধান করুন । তারপরে এই পদ্ধতিটি ব্যবহার করে মূল অবস্থানের তুলনায় এর অবস্থানটি পান । উদ্দেশ্যতে ওভারলে ক্রিয়াকলাপে অবস্থান পাঠান। যথাযথ প্রান্তিককরণ করুন।
বেনিটো বার্তোলি

2
বা ব্যবহার View.getLocationOnScreen(int[] location)বা View.getLocationInWindow(int[] location)। আমি নিশ্চিত না কোনটি ভাল।
বেনিটো বার্তোলি

@ গৌতম: "কোন ধারণা?" - পালসের ক্ষেত্রে এটি একটি চিত্রকে উপরের-বাম কোণে, অন্য একটি চিত্রকে কেন্দ্র করে এবং তৃতীয় চিত্রটি নীচে-ডানদিকে রাখার বিষয়টি। একটি উপর ভিত্তি করে এক্সএমএল এর এক ডজন বা তাই লাইনগুলি RelativeLayoutযথেষ্ট হবে।
কমন্সওয়্যার

1
এটি আমার পক্ষে কাজ করেছে, তবে ক্রিয়াকলাপ বাড়ানোর ক্ষেত্রে আমার ক্রিয়াকলাপে সমস্যা ছিল। সুতরাং অ্যাপকম্প্যাটঅ্যাক্টিভিটি ব্যবহার করার জন্য আমি শৈলীর এইরকম সংজ্ঞা দিয়েছি: <শৈলীর নাম = "স্বচ্ছ" পিতা বা মাতা = "থিম.অ্যাপকম্প্যাট"> <আইটেমের নাম = "অ্যান্ড্রয়েড: উইন্ডো কনটেন্ট ওভারলে"> @ নাল </ i>> <আইটেম নাম = "অ্যান্ড্রয়েড : উইন্ডোজআইট্রান্সলুসেন্ট "> সত্য </ i> << আইটেমের নাম =" অ্যান্ড্রয়েড: উইন্ডো ব্যাকগ্রাউন্ড "> @ অ্যান্ড্রয়েড: রঙ / স্বচ্ছ </ i> <আইটেমের নাম =" অ্যান্ড্রয়েড: উইন্ডোনিটাইটেল "> সত্য </ i> <আইটেমের নাম =" অ্যান্ড্রয়েড : ব্যাকগ্রাউন্ডডিমএইনেবল "> ভুয়া </item> </style>
জোস কিউ

65

আপনি শোকেসভিউ তাকান? 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);

1
ধন্যবাদ, আমি ঠিক তাই খুঁজছিলাম
Snicolas

অসাধারণ! আপনি কি আইওএস-এর অনুরূপ কিছু জানেন?
কেভিশ

অবহেলিত এখনও ... বিকাশকারী মানে বেসিক API এর নকশা যথেষ্ট ভাল ছিল না (যা আংশিকভাবে সত্য ছিল)।
লরেন্ট মেয়ার 21

আমি এটি চেষ্টা করে দেখেছি যে চিত্রগুলি পরিবর্তন করার জন্য কোনও ট্যাগ নেই।
আনশুল তায়াগি

11

নাড়িটি চারটি চিত্রগ্রাফ এবং চারটি পাঠ্যদর্শন সহ একটি রিলেটিভলআউট ব্যবহার করছে। স্ক্রিন শটের পাঠ্যটি সমস্ত নিজস্ব টেক্সটভিউর নিজস্ব কাস্টম ফন্টের সাথে রয়েছে।

আপনার ম্যানিফেস্টে আপনার ক্রিয়াকলাপে নিম্নলিখিতগুলি যুক্ত করুন:

অ্যান্ড্রয়েড থিম = "@ শৈলী / Theme.Transparent">

আপনার বাইরের সম্পর্কিত সম্পর্কিত লেআউটটিতে যুক্ত করুন:

অ্যান্ড্রয়েড: পটভূমি = "# aa000000"

আপনার স্টাইল.এক্সএমএল ফাইলটিতে:

<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/

হায়ারার্কি ভিউয়ারের লেআউটটি দেখতে দেখতে (লাল বাক্সটি রিলেটিভ লেআউট কনটেইনার):

এখানে চিত্র বর্ণনা লিখুন


6
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();

}

আমি সাধারণ এবং সোজা সামনের দিকে যা খুঁজছি, এবং কার্যকলাপগুলি নিয়ন্ত্রণ বা স্ট্যাকিং ছাড়াই সহজেই কল কল method ধন্যবাদ
অভিষেক গার্গ

5

এর জন্য আপনাকে আপনার মূল বিন্যাসের নীচে সহায়তা বিন্যাস তৈরি করতে হবে: (কাঠামো)

<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>

2

আপনার মূল বিন্যাসটি একটিতে মুড়ে দিন 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>

আমি বিশ্বাস করি ওভারলে লেআউটটি এক্সএমএল ফাইলের মূল বিন্যাসের নীচে যায় (যদি মেমোরিটি দেয় তবে)) তারপরে আপনি ViewFlipperএই দ্বিতীয় লেআউটের মধ্যে যা কিছু চান তা নিজের লেআউট তৈরি করতে পারেন।


1
আপনার প্রতিক্রিয়ার জন্য ধন্যবাদ! আমি এটি চেষ্টা করেছি এবং এটি কাজ করে বলে মনে হচ্ছে। তবে, একটি সমস্যা আছে - ওভারলে লেআউটের সামগ্রীটি আমার ক্রিয়াকলাপে থাকা অ্যাকশনবার বা অ্যাকশনবারের ট্যাবগুলিতে coverাকা দেয় না।
গৌতম

আপনি যোগ RelativeLayoutকরতে demo_activity.xmlফাইল? এবং DemoActivityআপনার প্রধান (প্রথম) Activity?
এরিক

ভাল 'ডেমো অ্যাক্টিভিটি' হ'ল আমার স্বচ্ছ ক্রিয়াকলাপ তৈরি করার চেষ্টা যা একই কাজ করবে। 'মেইনএ্যাকটিভিটি' হল সেই ক্রিয়াকলাপ যা আমি পটভূমির নীচে চাই। সুতরাং আমি 'মেইনএকটিভিটি' এর জন্য লেআউটটি আবৃত করেছি, যেমন 'মেইন_একটিভিটি.এক্সএমএল' যেমন আপনি উল্লেখ করেছেন তার মতো 'রিলেটিভলআউট' দিয়ে এবং স্বচ্ছ 'লিনিয়ারলআউট' sertedুকিয়েছি। সমস্যাটি হচ্ছে, 'main_activity.xML' এর সমস্ত সামগ্রী 'অ্যাকশনবার' এবং এর যেকোন নেভিগেশন ট্যাবের নীচে দেখানো হয়েছে।
গৌতম

1

একটি নতুন কার্যকলাপ করুন (টিউটোরিয়াল বলুন)।

আপনার ক্রিয়াকলাপের লেআউট এক্সএমএল ফাইলটিতে যান (ক্রিয়াকলাপ_টিউটোরিয়াল)। প্যারেন্ট লেআউটের অধীনে, "অ্যান্ড্রয়েড: ব্যাকগ্রাউন্ড = # 000" এবং "অ্যান্ড্রয়েড: আলফা =" 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>

এখন, অ্যাপ্লিকেশন ম্যানিফেস্ট ফাইলটিতে যান এবং আপনার টিউটোরিয়াল ক্রিয়াকলাপের অধীনে অ্যাট্রিবিউট অ্যান্ড্রয়েড যুক্ত করুন: থিম = "@ অ্যান্ড্রয়েড: শৈলী / থিম / ট্রান্সলুসেন্ট.নোটাইটেলবার">

<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>

এটি এখন, অন্য যে কোনও ক্রিয়াকলাপের শীর্ষে এই ক্রিয়াকলাপটি চালান এবং আপনি পছন্দসই ফলাফল পেতে পারেন। আপনার পছন্দসই টিউটোরিয়াল স্ক্রিন পেতে কাস্টমাইজ করুন, পাঠ্য, চিত্রদর্শন এবং অন্যান্য স্টাফ যুক্ত করুন। খুব নিশ্চিত যে আপনি এই কৌশলটি দিয়ে কোনও ভিউপেজারকে কাজ করতে পারবেন।


0

আপনি কেবল অ্যান্ড্রয়েড লঞ্চার কোডটি যেমনটি করেন ঠিক ততক্ষণ তা পরীক্ষা করে দেখতে পারেন। আমি সেখানে বাস্তবায়ন জানি না।

এটি যদি আমি হয় তবে আমি (কেবলমাত্র একটি সাধারণ ওভারলে থাকলে) তাই আপনি আপনার অ্যাপ্লিকেশনের জন্য আপনার বিন্যাসটি স্ক্রু করবেন না, কেবল আপনার ওভারলে লেআউটটি তৈরি করুন এবং এটি আপনার ক্রিয়াকলাপের সাথে সরাসরি যুক্ত করে আপনার অ্যাপ্লিকেশন বিন্যাসের সাথে সংযুক্ত করুন WindowManager। একটি যোগ হিসাবে সহজ হিসাবে হতে পারে ImageViewজন্য WindowManager, উপর ছোঁয়া শোনার ImageView, অথবা মুছে ফেলার জন্য তার সময় পার আছে ImageViewআপনার থেকে Window

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.