Android组件开发01——ViewPage+RadioGroup实现欢迎页组件

最新推荐文章于 2023-04-15 12:37:22 发布
最新推荐文章于 2023-04-15 12:37:22 发布
阅读量162 收藏
点赞数
文章标签： android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44408913/article/details/119011486
版权

一、布局

1.轮播欢迎页

欢迎页由一下四个部分组成，没有IP设置可以忽略IP设置按钮

  • ViewPage：用于存放切换页面
  • RadioGroup：切换按钮
  • TextView：网络IP设置按钮
  • Button：进入首页按钮
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/tvInternet"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity.WelcomeActivity">


    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </androidx.viewpager.widget.ViewPager>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="网络配置"
        android:textColor="#fff"
        android:textSize="24dp"
        android:layout_centerHorizontal="true"
        android:layout_above="@id/btnIndex"

        />

    <Button
        android:id="@+id/btnIndex"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:onClick="btnIndexClick"
        android:text="进入主页"
        android:layout_centerHorizontal="true"
        android:layout_above="@id/ll_welcome"
        />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="50dp"
        android:id="@+id/ll_welcome"
        >
        <RadioGroup
            android:id="@+id/rdGroup"
            android:orientation="horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            >

            <RadioButton
                android:id="@+id/rd1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <RadioButton
                android:id="@+id/rd2"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <RadioButton
                android:id="@+id/rd3"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <RadioButton
                android:id="@+id/rd4"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <RadioButton
                android:id="@+id/rd5"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />
        </RadioGroup>
    </LinearLayout>

</RelativeLayout>

2.设置IP对话框布局（可忽略）

由两部分组成：

  • IP输入
  • 端口输入
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">
    <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
    <TextView
        android:text="IP地址："
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

    </TextView>
    <EditText
        android:id="@+id/txtIp"
        android:hint="192.168.1.1"
        android:layout_width="300dp"
        android:layout_height="wrap_content">

    </EditText>
</LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <TextView
            android:text="端口号："
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

        </TextView>
        <EditText
            android:id="@+id/txtPort"
            android:hint="8080"
            android:layout_width="300dp"
            android:layout_height="wrap_content">

        </EditText>
    </LinearLayout>

</LinearLayout>

二、功能

1.保存设置的前置要求（可忽略）

1)App类

import android.app.Application;
import android.content.Context;

/**
 * 此类用于创建上下文对象
 */
public class App extends Application {

    public static Context context;
    @Override
    public void onCreate() {
        super.onCreate();
        context=getApplicationContext();
    }
}

2)SpHelper类

import android.content.SharedPreferences;

import com.neu.App;

/**
 * 此类用于操作SharedPreferences存储对象
 */
public class SpHelper {
    // 存储配置的sp文件名
    private final static String FILE_NAME="config";

    /**
     * 获得config对象里面的指定参数
     * @param name 参数名
     * @return 参数
     */
    public static String getString(String name){
        return getStSp().getString(name,"");
    }

    /**
     * 设置ShardPreferences
     * @param name key值
     * @param value value值
     */
    public static void setString(String name,String value){
        SharedPreferences sp=getStSp();
        SharedPreferences.Editor editor=getStSp().edit();
        editor.putString(name,value);
        editor.commit();
    }

    /**
     * 获得SharedPreferences 对象
     * @return 获得配置的对象如ID地址端口号
     */
    private static SharedPreferences getStSp(){
        return App.context.getSharedPreferences(FILE_NAME,App.context.MODE_PRIVATE);
    }
}

2.轮播图欢迎页（可忽略一些IP设置的代码）

import android.content.Intent;
import android.content.SharedPreferences;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.RadioGroup;
import android.widget.TextView;
import android.widget.Toast;

import com.neu.App;
import com.neu.MainActivity;
import com.neu.R;
import com.neu.util.SpHelper;

import java.util.regex.Matcher;
import java.util.regex.Pattern;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;

public class WelcomeActivity extends AppCompatActivity  {

    // 滑动ViewPager
    private ViewPager viewPager;
    // 网络配置文本对象
    private TextView textView;
    // 单选按钮组
    private RadioGroup rdGroup;
    // 单选按钮列表
    private int[] rbs = {R.id.rd1, R.id.rd2, R.id.rd3, R.id.rd4, R.id.rd5};
    // 进入首页按钮
    private Button btnIndex;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_welcome);
        // 获得名为first的参数
        String first=SpHelper.getString("first");
        // 比较是否是第一次进入
        if("first".equals(first)){
            // SharedPreferences里面config中包含first参数
            Intent intent=new Intent(this,MainActivity.class);
            // 直接进入主页
            startActivity(intent);
            // 销毁当前页
            finish();
        }
        // 初始化当前轮播图页
        initView();
    }

    // 这里写你要跳转的首页
    public void btnIndexClick(View view) {
        Intent intent = new Intent(this, MainActivity.class);
        startActivity(intent);
    }

    private void initView() {
        viewPager = (ViewPager) findViewById(R.id.viewPager);
        textView = (TextView) findViewById(R.id.textView);
        rdGroup = (RadioGroup) findViewById(R.id.rdGroup);

        viewPager.setAdapter(new PagerAdapter() {
            // 图片列表
            private int[] imgs = {R.drawable.a1, R.drawable.a2, R.drawable.a3, R.drawable.a4, R.drawable.a5};

            /**
             * 重写方法 加载每个页面出现的对象
             * @param container 父布局
             * @param position 当前位置
             * @return 对象
             */
            @NonNull
            @Override
            public Object instantiateItem(@NonNull ViewGroup container, int position) {
                // 创建图片
                ImageView pic = new ImageView(getApplicationContext());
                // 设置类型——居中显示？
                pic.setScaleType(ImageView.ScaleType.CENTER_CROP);
                // 设置图片
                pic.setImageResource(imgs[position]);
                // 添加进容器对象
                container.addView(pic);
                return pic;
            }

            /**
             * 销毁
             * @param container
             * @param position
             * @param object
             */
            @Override
            public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
                // 删除创建的对象
                container.removeView((View) object);
            }

            @Override
            public int getCount() {
                return imgs.length;
            }

            @Override
            public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
                return object == view;
            }
        });

        // 添加监听
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                // 单选按钮选中项改变
                rdGroup.check(rbs[position]);

                if (position + 1 == 5) {
                    // 最后一页显示设置对象
                    textView.setVisibility(View.VISIBLE);
                    btnIndex.setVisibility(View.VISIBLE);
                }else{
                    // 前面几页隐藏设置对象
                    textView.setVisibility(View.GONE);
                    btnIndex.setVisibility(View.GONE);
                }
            }

            @Override
            public void onPageSelected(int position) {

            }

            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });

        btnIndex = (Button) findViewById(R.id.btnIndex);

        textView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                setIp();
            }
        });

    }

    //设置IP
    private void setIp() {
        // 创建对话框
        AlertDialog.Builder builder=new AlertDialog.Builder(this);
        builder.setTitle("设置IP和端口号");
        // 创建IP输入view
        View view=getLayoutInflater().inflate(R.layout.dialog_ip,null);
        // 获得输入框对象
        final EditText txtIp=view.findViewById(R.id.txtIp);
        final EditText txtPort=view.findViewById(R.id.txtPort);
        // 设置view
        builder.setView(view);
        // 设置保存按钮
        builder.setPositiveButton("保存",null);
        // 创建对话框
        final AlertDialog dialog=builder.create();
        // 显示对话框
        dialog.show();
        // 获得保存按钮对象,设置监听
        dialog.getButton(AlertDialog.BUTTON_POSITIVE).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 判断IP地址是否合法
                if(!isboolIp(txtIp.getText().toString())){
                    Toast.makeText(App.context,"IP格式错误",Toast.LENGTH_LONG).show();
                    // 错误重新输入，聚焦
                    txtIp.setFocusable(true);
                }else{
                    if("".equals(txtPort.getText().toString())){
                        Toast.makeText(App.context,"端口不能为空",Toast.LENGTH_LONG).show();
                        txtIp.setFocusable(false);
                        // 端口输入框聚焦
                        txtPort.setFocusable(true);
                    }else{
                        //保存http://+ip+:+port
                        String url="http://"+txtIp.getText().toString()+":"+txtPort.getText().toString();
                        // 存入 SharedPreferences
                        SpHelper.setString("url",url);
                        Log.d("TAG", "onClick: "+SpHelper.getString("url"));

                        //设置第一次已完成，后面不在弹出welcome
                        SpHelper.setString("first","first");

                        //关闭dialog
                        dialog.dismiss();
                    }
                }
            }
        });
    }

    // 判断是否是IP地址
    private boolean isboolIp(String ipAddress) {
        // 正则匹配是否是ip地址
        String ip = "([1-9]|[1-9]\\d|1\\d{2}|2[0-4]\\d|25[0-5])(\\.(\\d|[1-9]\\d|1\\d{2}|2[0-4]\\d|25[0-5])){3}";
        // 添加匹配器
        Pattern pattern = Pattern.compile(ip);
        // 正则匹配IP
        Matcher matcher = pattern.matcher(ipAddress);
        // 返回匹配的结果
        return matcher.matches();
    }



}
小C好好干饭
关注
Android典型界面设计——ViewPage+Fragment实现区域顶部tab滑动切换
无名
07-16 4357
一、问题描述 　　本系列将结合案例应用，陆续向大家介绍一些Android典型界面的设计，首先说说tab导航，导航分为一层和两层（底部区块+区域内头部导航），主要实现方案有RadioGroup+ViewPage+Fragment、Viewpager Indicator、ActionBar Tabs、FragmentTabHost+Fragment等，下面我们先采用RadioGroup+
安卓实现RadioGroup+Viewpager+Fragment底部导航栏和viewpager联动 DEMO下载
03-21
使用RadioGroup+Viewpager+Fragment实现底部菜单栏和viewpager页面联动. viewpager里是碎片 点击菜单栏viewpager滚动, 滑动viewpager底部菜单栏跟着滚动 有问题欢迎指出!
Android 原生 RadioGroup+ViewPage/安卓自带原生控件BottomNavigation 实现传统软件主页面切换
qq_49757305的博客
03-20 3299
Android 原生 RadioGroup+ViewPage 实现传统软件主页面切换 文章目录Android 原生 RadioGroup+ViewPage 实现传统软件主页面切换一、RadioGroup+ViewPage 实现1.新建项目新建一个空项目2.编写主页的XML3.为底部导航编写selector文件4.java部分1.第一步新建一个空的fragment2.第二步新建ViewPage的适配器类3.第三步 为主页的ViewPage设置适配器4.第四步 为底部导航与ViewPage进行关联联动 一、
RadioGroup+ViewPager组合切换监听
u010658122的博客
09-26 476
for (int i = 0; i < group.getChildCount(); i++) { final int position = i; RadioButton rb = (RadioButton) group.getChildAt(i); rb.setOnClickListener(new View.OnClickListener() )
viewpager左右滑动的 +Tab指示（方式1-------------RadioGroup+ViewPage+Fragment）
sunanter的博客
01-18 1172
http://www.hackbase.com/article-1495-1.html Android典型界面：tab导航，导航分为一层和两层（底部区块+区域内头部导航），主要实现方案RadioGroup+ViewPage+Fragment、Viewpager Indicator、ActionBar Tabs、FragmentTabHost+Fragment等，下面我们先采用RadioGro
viewpage+radiogroup
Ason_haiyu的博客
12-21 256
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent"
安卓Android源码——Tab+Viewpage+Fragment实现导航.zip
10-14
本压缩包“安卓Android源码——Tab+Viewpage+Fragment实现导航.zip”提供了一个这样的实现示例。下面将详细解释这些组件以及它们如何协同工作。 1. **Tab布局（Tab Layout）**： Tab布局是Android设计支持库中的一...
Tab+Viewpage+Fragment实现导航
10-20
在Android应用开发中，"Tab+ViewPager+Fragment"是一种常见的实现导航的方式，它允许用户在多个页面间平滑切换，同时提供清晰的导航结构。这个技术组合的优势在于它能够高效地管理和展示大量的内容，同时也提供了...
VIewPage+fragment+RadioGroup动态的添加RadioButton
09-10
总之，`VIewPage+fragment+RadioGroup动态的添加RadioButton`是Android应用开发中实现动态界面的一种常见方法，通过巧妙组合这些组件，开发者可以创建出高度交互和可定制的用户界面。理解并熟练掌握这些技术对于...
ViewPage + RadioGroup + Fragment + FrameLayout搭配解析
08-13
ViewPage + RadioGroup + Fragment + FrameLayout搭配解析，RadioGroup 里面有四个RadioButton切换，上面用ViewPage滑动，两边关联，可以相互的切换。也做了用FrameLayout可切换和不可切换的。
Android 首页轮播图实现
YDDUONG的博客
03-28 2708
先看一下效果：（图片是有指示器的，只是被上层的视图挡住了，这里不需要这个东西） 参考：https://github.com/zhpanvip/BannerViewPager 详细的API可以看这个：https://zhuanlan.zhihu.com/p/80802091 开始使用，添加依赖： allprojects { repositories { ... mav...
Android实现欢迎界面
weixin_43977664的博客
02-17 6011
Android项目实现欢迎界面 在我们使用软件的时候，打开一款应用，首先出现的就是欢迎界面，它不仅是应用的入口，也简单概括了app的功能，有美观的作用。同时，在显示欢迎界面的同时，我们可以为主页的数据进行预加载，这样可以让我们的UI更加流畅，用户体验更佳。 值得注意的是，欢迎界面分两种： ①第一次安装时的欢迎界面 ②首次启动（未关闭应用程序）时的欢迎界面 ...
android ViewPager实现软件初次开启的轮播图欢迎特效
码猿同学
12-14 2171
多数软件在初次下载开启或者更新后都有一个类似轮播图特效的欢迎界面，如下图： 当滑倒最后一页的时候开启显示开始体验按钮。现在来对这个样子进行实现，代码下有详细解释。 一 样式布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas
Android实现APP欢迎页面 - 自动轮播+页面跳转+判断
人走丿茶凉
08-07 6226
今天来一个ViewPager相关的的小程序：自动轮播+页面跳转+判断是否第一次进入！ (如果是第一次进入则显示欢迎页，否则直接进入到主页)话不多说，先来张效果图：要实现这个小程序，先来看一下具体是如何构成的：那么，接下来就是我们的代码实现步骤了！ 首先是我们的布局文件 activity_splash.xml：<android.support.v4.view.ViewPager an
通过RadioGroup 和ViewPager 以及Handler 实现图片的轮播
Kodulf的专栏
01-26 1570
参考：http://www.jb51.net/article/76233.htm 本文实例讲述了JaAndroid实现图片轮播效果代码，分享给大家供大家参考。具体如下： 运行效果截图如下： 具体代码如下： 首先看下一下布局文件： ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14
ViewPage+RadioGroup实现Tab切换
lan_学习分享
03-05 469
以前写过一篇也是Tab切换的文章，当时做安卓一年左右，单纯觉得这样能实现功能，但是没有注意到性能和代码简洁性的问题，文章为  http://blog.csdn.net/nzzl54/article/details/52537320今天的文章些许借鉴了这篇文章，这里面也介绍了几种Tab切换的设计，有兴趣的可以去看看：http://blog.csdn.net/u010583599/article/de...
安卓首页界面：用Banner框架实现Android轮播图效果
qq_68469751的博客
12-20 3311
1111
Android kotlin 实现轮播图功能(Banner1.4.10+RecyclerView+BRVAH3.0.6+androidx)
彬sir哥的博客
06-17 2786
11、图片点击事件，以上内容都可写成链式布局，这是轮播图的监听。3、播放到末尾后又重新回到开头。这依赖包还需要得到要添加，在。在添加以下代码，不添加就不行。，分别为6种样式和19种动画。1、动手/自动左右滑动。
【Android 项目实战】Banner2.1.0实现广告图片轮播
最新发布
weixin_70837985的博客
04-15 1359
添加要轮播的图片，并完成Banner的初始化。banner2.1.0运行演示。
Android开发：ViewPage轮播图实现教程
"这篇教程详细讲解了如何在Android平台上实现ViewPage组件的轮播图效果，包括必要的布局设计和关键代码实现。" 在Android开发中，实现ViewPage轮播图是一项常见且重要的任务，通常用于展示广告或者推荐内容。本教程...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值