Android实现奇怪的大冒险游戏菜单切换界面

相信大家在玩了奇怪的大冒险后对游戏菜单的切换产生了一些兴趣,下面就展开对这个界面实现的分析过程。

这个界面看上去是由左右两个按键实现左右转换的,实际上是Fragment和ViewPager组合实现的。

1、针对这个界面我提供了四个Frafment来模仿。

2、左右的两个按钮是用ImageView实现的。

3、左右按键的显示与消失在viewpager的Adapter中实现,具体看以下代码。

4、在两个ImageView的OnClickListener中OnClick中实现对Fragment的切换。

具体代码如下:

1>游戏菜单界面的XML代码:

 

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_fragment__game_menu"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/startup_bkg_gray"
    tools:context="com.example.app_damaoxian.Fragment_GameMenuActivity">
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <FrameLayout
            android:id="@+id/fragmentLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </FrameLayout>
    </android.support.v4.view.ViewPager>

    <ImageView
        android:id="@+id/iv_moveleft"
        android:scaleType="centerInside"
        android:clickable="true"
        android:layout_width="50dp"
        android:layout_height="75dp"
        android:background="@drawable/background_left"
        android:layout_centerVertical="true"
        android:layout_marginStart="50dp"/>
    <ImageView
        android:id="@+id/iv_moveright"
        android:scaleType="centerInside"
        android:clickable="true"
        android:layout_width="50dp"
        android:layout_height="75dp"
        android:background="@drawable/background_right"
        android:layout_centerVertical="true"
        android:layout_alignParentRight="true"
        android:layout_marginEnd="50dp"/>

    <ImageView
        android:id="@+id/fragement_back"
        android:scaleType="centerInside"
        android:layout_marginRight="5dp"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:clickable="true"
        android:background="@drawable/background_back"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true" />
</RelativeLayout>

2>游戏菜单界面的Activity代码java:

 

 

package com.example.app_damaoxian;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RelativeLayout;

import java.util.ArrayList;
import java.util.List;

public class Fragment_GameMenuActivity extends AppCompatActivity {
    private ViewPager viewPager;
    private ImageView iv_back,iv_right,iv_left;
    private RelativeLayout relativeLayout;
    private int count0=0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_fragment__game_menu);
        relativeLayout=(RelativeLayout)findViewById(R.id.activity_fragment__game_menu);
        relativeLayout.setSystemUiVisibility(View.SYSTEM_UI_FLAG_FULLSCREEN);
        initView();
    }
    void initView(){
        /**
         * 利用Fragment和ViewPager实现平滑移动效果
         */
        List<Fragment>fragments=new ArrayList<Fragment>();
        fragments.add(new Fragment_gameMenu0());
        fragments.add(new Fragment_gameMenu1());
        fragments.add(new Fragment_gameMenu2());
        fragments.add(new Fragment_gameMenu3());
        FragmentsAdapter fragmentsAdapter=new FragmentsAdapter(getSupportFragmentManager(),fragments);
        viewPager=(ViewPager)findViewById(R.id.viewPager);
        viewPager.setAdapter(fragmentsAdapter);
        /**
         * 定义返回界面的接口
         */
        iv_back=(ImageView)findViewById(R.id.fragement_back);
        iv_back.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
                overridePendingTransition(R.animator.fragment_in,R.animator.fragment_out);
            }
        });
        /**
         * 定义左右按键的接口
         */
        iv_left=(ImageView)findViewById(R.id.iv_moveleft);
        iv_right=(ImageView)findViewById(R.id.iv_moveright);
                /**
                 * 初始化的一些条件
                 */
        if (count0==0){
            iv_left.setVisibility(View.GONE);
        }
        iv_left.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (count0==1){
                    iv_left.setVisibility(View.GONE);
                }
                if (count0==0){
                    count0=0;
                    iv_left.setVisibility(View.GONE);
                }
                else {
                    --count0;
                }
                viewPager.setCurrentItem(count0);
                iv_right.setVisibility(View.VISIBLE);
            }
        });
        iv_right.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                if (count0==2){
                    iv_right.setVisibility(View.GONE);
                }
                if (count0==3){
                    count0=3;
                    iv_right.setVisibility(View.GONE);
                }else {
                    ++count0;
                }
                viewPager.setCurrentItem(count0);
                iv_left.setVisibility(View.VISIBLE);
            }
        });
    }
    class FragmentsAdapter extends FragmentPagerAdapter{
        private List<Fragment>mfragments;
        public FragmentsAdapter(FragmentManager fragmentManager,List<Fragment>Fragments){
            super(fragmentManager);
            this.mfragments=Fragments;
        }

        @Override
        public void setPrimaryItem(ViewGroup container, int position, Object object) {
            initPosition(position);
            super.setPrimaryItem(container, position, object);
        }

        @Override
        public Fragment getItem(int position) {
            return mfragments.get(position);
        }

        @Override
        public int getCount() {
            return mfragments.size();
        }
    }
    private void initPosition(int position){
        count0=position;
        switch (position){
            case 0:
                iv_left.setVisibility(View.GONE);
                iv_right.setVisibility(View.VISIBLE);
                break;
            case 1:
                iv_left.setVisibility(View.VISIBLE);
                iv_right.setVisibility(View.VISIBLE);
                break;
            case 2:
                iv_left.setVisibility(View.VISIBLE);
                iv_right.setVisibility(View.VISIBLE);
                break;
            case 3:
                iv_left.setVisibility(View.VISIBLE);
                iv_right.setVisibility(View.GONE);
                break;
            default:
                break;
        }
    }

    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if (keyCode==KeyEvent.KEYCODE_BACK){
            finish();
            overridePendingTransition(R.animator.fragment_in,R.animator.fragment_out);
        }
        else {

        }
        return super.onKeyDown(keyCode, event);
    }

    @Override
    public void onBackPressed() {
        finish();
        overridePendingTransition(R.animator.fragment_in,R.animator.fragment_out);
        super.onBackPressed();
    }
}


3>其中的一个Fragment的XML代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
        android:orientation="vertical"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:background="@drawable/stageselect_frame"
        android:layout_width="450dp"
        android:layout_height="280dp">

        <ImageView
            android:layout_marginTop="60dp"
            android:layout_width="match_parent"
            android:layout_height="25dp"
            android:src="@drawable/stageselect_title2"
            android:id="@+id/imageView0" />
    </LinearLayout>
    <TextView
        android:id="@+id/game_1_0"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:text="1"
        android:gravity="center"
        android:background="@drawable/background_mnumber"
        android:textSize="45dp"
        android:textColor="@color/coloBlack"
        android:clickable="true"
        android:layout_width="70dp"
        android:layout_height="70dp" />
</RelativeLayout>

 

4>Fragment的Java代码:

 

package com.example.app_damaoxian;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

/**
 * Created by 尽途 on 2017/4/15.
 */

public class Fragment_gameMenu1 extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view=inflater.inflate(R.layout.fragment_gamemenu1,container,false);
        return view;
    }
    void initView(View view) {

    }
}

最后注意,Fragment使用V4包。这个和之前介绍的微信Fragment同出一门。

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值