点击上下左右按钮让背景上下左右移动

时间:2022-10-24 10:54:58

       工作了这么长时间还从来没写过博客,最近闲来无事,忽然想写点东西与大家交流学习,如果哪里有不正确的地方欢迎大家指正。好了不说废话先上效果图:

点击上下左右按钮让背景上下左右移动点击上下左右按钮让背景上下左右移动

当在一图输入数字后会在二图显示对应数字的控件,当点击上下左右时,红色会上下左右移动,图二是在点击右-上-右-右-右时的效果当在第一行点上时会跑到最后一行对应的位置,当在最后一行点下时会跑到第一行对应的位置,当在按钮0点左时会跑到最后一个,当在最后一个点右时会跑到按钮0。如何实现呢?第一个界面就不说了相信大家对大家一点难度也没有,从第二张图片说起。第一步:获取从图一输入的数字;

String str=getIntent().getStringExtra("num");
num=Integer.valueOf(str);
第二步:动态创建控件,创建的控件属为输入的数字,在布局里静态创建四个按钮并设置监听;

布局文件:

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

    <RelativeLayout
        android:id="@+id/rl_bton"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/rl_up"
        style="@style/mw_layout"
        android:layout_below="@+id/rl_bton"
        android:layout_marginTop="30dp"
        android:gravity="center">

        <TextView
            android:id="@+id/tv_up"
            style="@style/ww_layout"
            android:text="上"/>


    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/rl_rightandleft"
        style="@style/mw_layout"
        android:layout_below="@+id/rl_up"
        android:gravity="center">

        <TextView
            android:id="@+id/tv_left"
            style="@style/ww_layout"
            android:text="左"/>

        <TextView
            android:id="@+id/tv_right"
            style="@style/ww_layout"
            android:layout_marginLeft="40dp"
            android:layout_toRightOf="@+id/tv_left"
            android:text="右"/>
    </RelativeLayout>

    <RelativeLayout
        android:id="@+id/rl_down"
        style="@style/mw_layout"
        android:layout_below="@+id/rl_rightandleft"
        android:gravity="center">

        <TextView
            android:id="@+id/tv_down"
            style="@style/ww_layout"
            android:gravity="center"
            android:text="下"/>
    </RelativeLayout>
</RelativeLayout>
Activity:

private void createControl() {
    //获取屏幕尺寸
    DisplayMetrics dm = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(dm);
    int width = dm.widthPixels;

    //动态创建button
    RelativeLayout layout = (RelativeLayout) findViewById(R.id.rl_bton);
    bt = new Button[num];
    int j = -1;
    for (int i = 0; i < bt.length; i++) {
        bt[i] = new Button(this);
        bt[i].setText("按钮" + i);
        //所有的button默认背景为蓝色
        bt[i].setBackgroundColor(Color.parseColor("#6699ff"));
        //设置按钮的宽度和高度
        RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams((width - 50) / 4, 40);
        if (i % 4 == 0) {
            j++;
        }
        //控件的左间距和上间距
        params.leftMargin = 10 + ((width - 50) / 4 + 10) * (i % 4);
        params.topMargin = 20 + 55 * j;
        layout.addView(bt[i], params);
    }
    //给button0默认设置为红色
    bt[0].setBackgroundColor(Color.parseColor("#f34649"));
    
}
最后一步就是实现上下左右移动的逻辑了。向上移动减四,向下移动位置加四,向左移动位置减一,向右移动位置加一

@Override
public void onClick(View v) {
    switch (v.getId()) {
        case R.id.tv_up:
            //把背景设置为默认的背景色
            bt[i].setBackgroundColor(Color.parseColor("#6699ff"));
                //向上移动位置减四
                if (i - 4 < 0) {
                    if ((Math.floor(num / 4) * 4 + i) < bt.length) {
                        i = (int) Math.floor(num / 4) * 4 + i;
                        Log.d("111111111", String.valueOf(i));
                        bt[i].setBackgroundColor(Color.parseColor("#f34649"));
                    } else {

                        i = bt.length + i - 4 - bt.length % 4;
                        bt[i].setBackgroundColor(Color.parseColor("#f34649"));
                    }

                } else {
                    i -= 4;
                    bt[i].setBackgroundColor(Color.parseColor("#f34649"));
                }

            break;
        case R.id.tv_left:
            bt[i].setBackgroundColor(Color.parseColor("#6699ff"));
            //向左移动位置减一
            if (i - 1 < 0) {
                i = bt.length + i - 1;
                bt[i].setBackgroundColor(Color.parseColor("#f34649"));
            } else {
                i -= 1;
                bt[i].setBackgroundColor(Color.parseColor("#f34649"));
            }

            break;
        case R.id.tv_right:
            bt[i].setBackgroundColor(Color.parseColor("#6699ff"));
            //向右移动位置加一
            if (i + 1 >= bt.length) {
                i = i + 1 - bt.length;
                bt[i].setBackgroundColor(Color.parseColor("#f34649"));
            } else {
                i += 1;
                bt[i].setBackgroundColor(Color.parseColor("#f34649"));
            }

            break;
        case R.id.tv_down:
            bt[i].setBackgroundColor(Color.parseColor("#6699ff"));
            //向下移动位置加四
            if (i + 4 >= bt.length) {
                i = i - (int) Math.floor(i / 4) * 4;
                bt[i].setBackgroundColor(Color.parseColor("#f34649"));
            } else {
                i += 4;
                bt[i].setBackgroundColor(Color.parseColor("#f34649"));
            }

            break;


    }
}
以上就是本贴的内容,希望能帮助到需要的朋友,如有错误之处欢迎指正!