Android studio APP开发 控制UI布局的方式,用代码书写UI界面,代码和XML混合控制UI布局

控制UI布局的方式

UI界面就是APP的界面,Android提供4种方法控制UI界面,这里主要讲两种。

代码控制UI界面

直接在Activity中用代码设置UI界面的组件以及组件的点击事件。

步骤一: 首先注意,如果要完全用代码手写一个UI界面,需将Activity中的下面这行代码删掉,不删会有影响。

setContentView(R.layout.activity_main);

也就是说Activity不能和现有的布局文件进行绑定。

步骤二: 在onCreate()方法中,创建一个帧布局管理器,并为该布局管理器设置背景。

//创建一个帧布局管理器,并为该布局管理器设置背景关键代码
        FrameLayout frameLayout = new FrameLayout(this);   // 创建帧布局管理器
        frameLayout.setBackgroundResource(R.drawable.ic_launcher_background);  //设置背景
        setContentView(frameLayout);    //设置在Activity中显示frameLayout

到此就创建了一个布局文件,不会在文件目录中显示这个布局,因为不是以xml文件格式存储,此时运行程序,打开的就是一个只有背景图片的界面。

步骤三: 创建一个TextView组件,设置其文字大小和颜色,并将其添加到布局管理器中。

TextView textView = new TextView(this);
        textView.setText("用代码控制UI界面");   // 设置显示的数字
        textView.setTextSize(TypedValue.COMPLEX_UNIT_SP,24);   //设置文本字大小,单位为sp
        textView.setTextColor(Color.rgb(1,1,1));  // 设置文字的颜色
        frameLayout.addView(textView);   // 将textView 添加到布局管理器中

这就相当于在XML文件中添加了一个TextView控件。可以设置很多属性,需要时可以自己去学习。

步骤四:再创建一个TextView控件,并为这个控件设置点击事件。

        TextView text2 = new TextView(this);
        text2.setText("单击进入游戏...");
        text2.setTextSize(TypedValue.COMPLEX_UNIT_SP,24);
        text2.setTextColor(Color.rgb(1,1,1));
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(
                ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT); //创建布局参数对象
        params.gravity = Gravity.CENTER_HORIZONTAL | Gravity.CENTER_VERTICAL;  //设置居中显示
        text2.setLayoutParams(params); //设置布局参数

        //为text2组件添加单击事件监听器,并将该组建添加到布局管理器中,具体代码如下:
        text2.setOnClickListener(new View.OnClickListener() {  //为text2设置点击事件
            @Override
            public void onClick(View v) {
                new AlertDialog.Builder(MainActivity.this).setTitle("系统提示")  //设置对话框的标题
                        .setMessage("游戏有风险,进入需谨慎,真的要进入吗?") //设置对话框显示的内容
                        .setPositiveButton("确定", new DialogInterface.OnClickListener() { //为确定按钮设置点击事件
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                                Log.i("3.2","进入游戏"); //输出日志信息。
                                //可以在这里设置其他的点击事件,比如页面跳转
                            }
                        }).setNegativeButton("退出", new DialogInterface.OnClickListener() { //为退出按钮设置点击事件
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        Log.i("3.2","退出游戏");  //输出消息日志
                        finish(); //结束游戏退出程序。 就是让当前Activity出栈
                    }
                }).show();
            }
        });
        frameLayout.addView(text2);  //将text2添加到布局管理器中,就是添加到UI布局中,没有此代码添加的text2控件不生效

设置点击事件的代码很关键,这里 是一个弹框为例,实际可以设置很多不同的点击事件。
并且建议将text2设置为全局变量,就要在onCreate之前声明这个组件。

public TextView text2;

这只是用代码控制UI布局的开始,仅仅是冰山一角。实际上可以通过代码做很多的事情,比如设计一个自己需要的组件,独一无二的组件。我在之后的学习中如果遇到会尽量讲到这些。 接下来是整体代码:

public class MainActivity extends AppCompatActivity {

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

        //创建一个帧布局管理器,并为该布局管理器设置背景关键代码
        FrameLayout frameLayout = new FrameLayout(this);   // 创建帧布局管理器
        frameLayout.setBackgroundResource(R.drawable.ic_launcher_background);  //设置背景
        setContentView(frameLayout);    //设置在Activity中显示frameLayout

        TextView textView = new TextView(this);
        textView.setText("用代码控制UI界面");   // 设置显示的数字
        textView.setTextSize(TypedValue.COMPLEX_UNIT_SP,24);   //设置文本字大小,单位为sp
        textView.setTextColor(Color.rgb(1,1,1));  // 设置文字的颜色
        frameLayout.addView(textView);   // 将textView 添加到布局管理器中

        text2 = new TextView(this);
        text2.setText("单击进入游戏...");
        text2.setTextSize(TypedValue.COMPLEX_UNIT_SP,24);
        text2.setTextColor(Color.rgb(1,1,1));
        FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(
                ViewGroup.LayoutParams.WRAP_CONTENT,
                ViewGroup.LayoutParams.WRAP_CONTENT); //创建布局参数对象
        params.gravity = Gravity.CENTER_HORIZONTAL | Gravity.CENTER_VERTICAL;  //设置居中显示
        text2.setLayoutParams(params); //设置布局参数

        //为text2组件添加单击事件监听器,并将该组建添加到布局管理器中,具体代码如下:
        text2.setOnClickListener(new View.OnClickListener() {  //为text2设置点击事件
            @Override
            public void onClick(View v) {
                new AlertDialog.Builder(MainActivity.this).setTitle("系统提示")  //设置对话框的标题
                        .setMessage("游戏有风险,进入需谨慎,真的要进入吗?") //设置对话框显示的内容
                        .setPositiveButton("确定", new DialogInterface.OnClickListener() { //为确定按钮设置点击事件
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                                Log.i("3.2","进入游戏"); //输出日志信息。
                                //可以在这里设置其他的点击事件,比如页面跳转
                            }
                        }).setNegativeButton("退出", new DialogInterface.OnClickListener() { //为退出按钮设置点击事件
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        Log.i("3.2","退出游戏");  //输出消息日志
                        finish(); //结束游戏退出程序。 就是让当前Activity出栈
                    }
                }).show();
            }
        });
        frameLayout.addView(text2);  //将text2添加到布局管理器中,就是添加到UI布局中,没有此代码添加的text2控件不生效
    }
}

运行效果

代码和XML混合控制UI布局。

这是我们必须熟练掌握的方法。
直接看代码:

public class SecondActivity extends AppCompatActivity  {
    private ImageView[] img = new ImageView[4];
    private ImageView imag;
    private int[] imagePath = new int[]{
            R.drawable.image_1,R.drawable.image_2
    };
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);
        LinearLayout linearLayout = (LinearLayout) findViewById(R.id.layout);
        for(int i=0;i<imagePath.length;i++){
            img[i] = new ImageView(this);
            img[i].setImageResource(R.drawable.image_1);
            img[i].setPadding(5,5,5,5);
            LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(120,70);
            img[i].setLayoutParams(params);
            linearLayout.addView(img[i]);
        }
        imag = new ImageView(this);
        imag.setImageResource(R.drawable.image_1);
        imag.setPadding(5,5,5,5);
        LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(120,70);
        imag.setLayoutParams(params);
        linearLayout.addView(imag);
    }
}
发布了128 篇原创文章 · 获赞 6 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/Ace_bb/article/details/104721567