Question

我想在我的应用中添加简介屏幕。它应该从一个页面滑动到另一个页面。我想添加3个屏幕。屏幕如下：

底部有3个点。我想实现这些。此外，当它滑到下一页时，它的颜色变化以及位置变化到中间点。

我找到了一个为此提供默认结构的库。因为他们在屏幕底部给出了点，然后在左边跳过并在右边跳过。

https://github.com/PaoloRotolo/AppIntro。

这是我寻找的图书馆。我可以根据需要实施吗？

但我想要的布局就像我在这里展示的图像一样。我怎样才能做到这一点？

现在我已经创建了布局：

  <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg"
    android:weightSum="1">

    <ImageView
        android:layout_width="180dp"
        android:layout_height="50dp"
        android:id="@+id/imageView9"
        android:layout_gravity="center_horizontal"
        android:background="@drawable/logo_g"
        android:layout_marginTop="20dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />

    <ImageView
        android:layout_width="200dp"
        android:layout_height="160dp"
        android:id="@+id/imageView10"
        android:layout_gravity="center"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/imageView9"
        android:layout_marginTop="30dp" />

    <TextView
        android:layout_width="220dp"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="@string/walkthrough1"
        android:id="@+id/textView3"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="10dp"
        android:textAlignment="center"
        android:textStyle="bold"
        android:layout_below="@+id/imageView10"
        android:layout_centerHorizontal="true"
        android:textColor="@android:color/black" />

    <LinearLayout
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="30dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:layout_below="@+id/textView3"
        android:id="@+id/linearLayout8"
        android:layout_alignLeft="@+id/button2"
        android:layout_alignStart="@+id/button2"
        android:layout_alignRight="@+id/button2"
        android:layout_alignEnd="@+id/button2">

        <View
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:background="@drawable/circle"></View>

    </LinearLayout>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="SIGN UP"
        android:id="@+id/button2"
        android:background="#66BB6A"
        android:textColor="@android:color/white"
        android:layout_below="@+id/linearLayout8"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="30dp"
        android:layout_marginRight="30dp" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAppearance="?android:attr/textAppearanceMedium"
        android:text="SKIP"
        android:id="@+id/textView4"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="10dp"
        android:textColor="@android:color/black" />

</RelativeLayout>

我想在点的位置添加3个圆形视图，并在滑动到下一页时更改其颜色。但我不知道如何才能获得这样的点视图以及如何在页面之间滑动。

任何人都可以帮忙吗？谢谢..

Answer 1

试试这段代码： actvity_startup.xml：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:id="@+id/gallery_paging"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:background="#000000"
 android:orientation="vertical" >
 <include layout="@layout/toolbar" />
 <Gallery
    android:id="@+id/mygallery01"
    android:layout_width="fill_parent"
    android:layout_below="@+id/my_awesome_toolbar"
    android:layout_height="fill_parent"/>
   <LinearLayout
    android:id="@+id/image_count"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:orientation="horizontal"
    android:gravity="center" >
    </LinearLayout>
    <Button
    android:id="@+id/done"
    android:layout_width="250dp"
    android:layout_height="wrap_content"
    android:layout_above="@+id/image_count"
    android:layout_centerHorizontal="true"
    android:layout_marginBottom="18dp"
    android:background="#e74c3c"
    android:textColor="@color/white"
    android:textSize="25sp"
    android:textStyle="bold"
    android:text="Let's Start" />
</RelativeLayout>

StartUp.class：

package com.osomebuzz.meme_creator;

 import com.osomebuzz.meme_creator.adapter.IamgeAdapter;
 import android.content.Intent;
 import android.graphics.Typeface;
 import android.os.Bundle;
 import android.support.v7.app.AppCompatActivity;
  import android.support.v7.widget.Toolbar;
 import android.view.View;
 import android.view.View.OnClickListener;
 import android.widget.AdapterView;
 import android.widget.AdapterView.OnItemSelectedListener;
 import android.widget.Button;
 import android.widget.Gallery;
 import android.widget.LinearLayout;
 import android.widget.TextView;

 @SuppressWarnings("deprecation")
 public class StartUp extends AppCompatActivity {
 Gallery gallery;
    IamgeAdapter imageAdapter;
    LinearLayout count_layout;
    int count = 0;
    static TextView page_text[];
    TextView toolbartitle;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_startup);


    count_layout = (LinearLayout) findViewById(R.id.image_count);
    gallery = (Gallery) findViewById(R.id.mygallery01);
    Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
    toolbartitle = (TextView) findViewById(R.id.titletool);
    toolbartitle.setText("Make Funny Photos");
    //getSupportActionBar().setTitle("Make Funny Photos");
    setSupportActionBar(toolbar);
    final Button done = (Button) findViewById(R.id.done);

    done.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            Intent next = new Intent(getApplicationContext(),   

      MainActivity.class);
            startActivity(next);
            finish();
        }
    });
    imageAdapter = new IamgeAdapter(this);
    gallery.setAdapter(imageAdapter);
    count=gallery.getAdapter().getCount();
    page_text = new TextView[count];
    for (int i = 0; i < count; i++) {
        page_text[i] = new TextView(this);
        page_text[i].setText(".");
        page_text[i].setTextSize(45);
        page_text[i].setTypeface(null, Typeface.BOLD);
        page_text[i].setTextColor(android.graphics.Color.GRAY);
        count_layout.addView(page_text[i]);
    }
    gallery.setOnItemSelectedListener(new OnItemSelectedListener() {

        public void onItemSelected(AdapterView<?> arg0, View arg1,
                int position, long arg3) {
            // TODO Auto-generated method stub
            if(position == 0){
                done.setVisibility(View.INVISIBLE);

            }
            if(position == 1){
                done.setVisibility(View.INVISIBLE);

            }
            if(position == 2){
                done.setVisibility(View.INVISIBLE);

            }
            if(position == 3){
                done.setVisibility(View.INVISIBLE);

            }if(position == 4){
                done.setVisibility(View.VISIBLE);

            }
             for (int i = 0; i < count; i++) {


 StartUp.page_text[i].setTextColor(android.graphics.Color.GRAY);
                }


StartUp.page_text[position].setTextColor(android.graphics.Color.WHITE);

        }

        public void onNothingSelected(AdapterView<?> arg0) {
            // TODO Auto-generated method stub

        }
    });

     }

    }

ImageAdapter.class：

public class IamgeAdapter extends BaseAdapter {
private Context context;

public IamgeAdapter(Context c) {
// TODO Auto-generated constructor stub
this.context = c;
}
public int getCount() {
// TODO Auto-generated method stub
return flowers.length;
}
public Object getItem(int position) {
// TODO Auto-generated method stub
return position;
}
public long getItemId(int position) {
// TODO Auto-generated method stub
return position;
}
public View getView(int position, View convertView, ViewGroup parent) {
// TODO Auto-generated method stub
ImageView image = new ImageView(context);
image.setImageResource(flowers[position]);
image.setScaleType(ScaleType.FIT_XY);
// image.setLayoutParams(new Gallery.LayoutParams(400, 400));
return image;
}
int[] flowers = { R.drawable.start1, R.drawable.start2, 

R.drawable.start3,R.drawable.start4,R.drawable.start5};

}

Answer 2

您可以尝试使用符合您要求的ViewPager组件

http://developer.android.com/training/animation/screen-slide.html

@Damini Mehra：自API 16以来，Gallery组件已弃用

如何制作应用程序的演练（介绍）屏幕？

2 个答案: