脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 软件编程 → Android → android选项卡滑动

Android实现类似网易新闻选项卡动态滑动效果

 更新时间：2016年11月27日 09:51:55   作者：孤独战狼  
这篇文章主要介绍了Android实现类似网易新闻选项卡动态滑动效果的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下

 本文会实现一个类似网易新闻（不说网易新闻大家可能不知道大概是什么样子）点击超多选项卡，选项卡动态滑动的效果。

首先来看看布局，就是用HorizontalScrollView控件来实现滑动的效果，里面包含了一个布局。

接下来我们在onCreat方法中加载布局和构建我们需要显示的数据

<code class="hljs avrasm"> @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tabbar);
tv_tabname= (TextView) this.findViewById(R.id.tv_tabname);
titleList = new ArrayList<string>();
titleList.add("推荐");
titleList.add("热点");
titleList.add("北京");
titleList.add("体育");
titleList.add("娱乐");
titleList.add("足球");
titleList.add("巴萨");
titleList.add("汽车");
}</string></code>

加载布局，用RadioGroup动态的加载多个自定义的RadioButton

<code class="hljs avrasm">hs_activity_tabbar= (HorizontalScrollView) this.findViewById(R.id.hs_activity_tabbar);
ll_activity_tabbar_content= (LinearLayout) this.findViewById(R.id.ll_activity_tabbar_content);
//选项卡布局
myRadioGroup = new RadioGroup(this);
myRadioGroup.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
myRadioGroup.setOrientation(LinearLayout.HORIZONTAL);
ll_activity_tabbar_content.addView(myRadioGroup);
for (int i = 0; i < titleList.size(); i++) {
String channel = titleList.get(i);
RadioButton radio = new RadioButton(this);
radio.setButtonDrawable(android.R.color.transparent);
radio.setBackgroundResource(R.drawable.radiobtn_selector);
ColorStateList csl = getResources().getColorStateList(R.color.radiobtn_text_color);
radio.setTextColor(csl);
LinearLayout.LayoutParams l = new LinearLayout.LayoutParams((int) SizeHelper.dp2px(this, 80), ViewGroup.LayoutParams.MATCH_PARENT, Gravity.CENTER);
radio.setLayoutParams(l);
radio.setTextSize(15);
radio.setGravity(Gravity.CENTER);
radio.setText(channel);
radio.setTag(channel);
myRadioGroup.addView(radio);
}</code>

最后也就点击选项卡的时候会有一个动态滑动的效果，其实就是利用HorizontalScrollView的smoothScrollTo方法来实现的

<code class="hljs cs"> myRadioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
int radioButtonId = group.getCheckedRadioButtonId();
//根据ID获取RadioButton的实例
RadioButton rb = (RadioButton) findViewById(radioButtonId);
channel = (String) rb.getTag();
mCurrentCheckedRadioLeft = rb.getLeft();//更新当前按钮距离左边的距离
int width=(int) SizeHelper.dp2px(TabbarActivity.this, 140);
hs_activity_tabbar.smoothScrollTo((int) mCurrentCheckedRadioLeft - width, 0);
tv_tabname.setText(channel);
}
});
//设定默认被选中的选项卡为第一项
if (!titleList.isEmpty()) {
myRadioGroup.check(myRadioGroup.getChildAt(0).getId());
}</code>

dp2px方法如下用来将dp转换为px：

<code class="hljs java"> public static float dp2px(Context context, float dp) {
final float scale = context.getResources().getDisplayMetrics().density;
return (dp * scale);
}</code>

全部代码为：

<code class="hljs avrasm">package com.example.liuwangshu.myslidetabbar;
import android.content.res.ColorStateList;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.ViewGroup;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class TabbarActivity extends AppCompatActivity {
private HorizontalScrollView hs_activity_tabbar;
private RadioGroup myRadioGroup;
private List<string> titleList;
private LinearLayout ll_activity_tabbar_content;
private float mCurrentCheckedRadioLeft;//当前被选中的RadioButton距离左侧的距离
private String channel;
private TextView tv_tabname;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tabbar);
tv_tabname= (TextView) this.findViewById(R.id.tv_tabname);
titleList = new ArrayList<string>();
titleList.add("推荐");
titleList.add("热点");
titleList.add("北京");
titleList.add("体育");
titleList.add("娱乐");
titleList.add("足球");
titleList.add("巴萨");
titleList.add("汽车");
initGroup();
}
private void initGroup() {
hs_activity_tabbar= (HorizontalScrollView) this.findViewById(R.id.hs_activity_tabbar);
ll_activity_tabbar_content= (LinearLayout) this.findViewById(R.id.ll_activity_tabbar_content);
//选项卡布局
myRadioGroup = new RadioGroup(this);
myRadioGroup.setLayoutParams(new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
myRadioGroup.setOrientation(LinearLayout.HORIZONTAL);
ll_activity_tabbar_content.addView(myRadioGroup);
for (int i = 0; i < titleList.size(); i++) {
String channel = titleList.get(i);
RadioButton radio = new RadioButton(this);
radio.setButtonDrawable(android.R.color.transparent);
radio.setBackgroundResource(R.drawable.radiobtn_selector);
ColorStateList csl = getResources().getColorStateList(R.color.radiobtn_text_color);
radio.setTextColor(csl);
LinearLayout.LayoutParams l = new LinearLayout.LayoutParams((int) SizeHelper.dp2px(this, 80), ViewGroup.LayoutParams.MATCH_PARENT, Gravity.CENTER);
radio.setLayoutParams(l);
radio.setTextSize(15);
radio.setGravity(Gravity.CENTER);
radio.setText(channel);
radio.setTag(channel);
myRadioGroup.addView(radio);
}
myRadioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
int radioButtonId = group.getCheckedRadioButtonId();
//根据ID获取RadioButton的实例
RadioButton rb = (RadioButton) findViewById(radioButtonId);
channel = (String) rb.getTag();
mCurrentCheckedRadioLeft = rb.getLeft();//更新当前按钮距离左边的距离
int width=(int) SizeHelper.dp2px(TabbarActivity.this, 140);
hs_activity_tabbar.smoothScrollTo((int) mCurrentCheckedRadioLeft - width, 0);
tv_tabname.setText(channel);
}
});
//设定默认被选中的选项卡为第一项
if (!titleList.isEmpty()) {
myRadioGroup.check(myRadioGroup.getChildAt(0).getId());
}
}
}
</string></string></code>

来看看效果

这里写图片描述

以上所述是小编给大家介绍的Android实现类似网易新闻选项卡动态滑动效果，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的，在此也非常感谢大家对脚本之家网站的支持！

您可能感兴趣的文章:

相关文章

  • 谈谈Android Fragments 详细使用

    谈谈Android Fragments 详细使用

    本篇文章主要介绍了Android Fragments 详细使用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2016-12-12
  • Android中AutoCompleteTextView自动提示

    Android中AutoCompleteTextView自动提示

    这篇文章主要为大家详细介绍了Android中AutoCompleteTextView自动提示的实现代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2016-12-12
  • 从零开始学android实现计算器功能示例分享(计算器源码)

    从零开始学android实现计算器功能示例分享(计算器源码)

    这篇文章主要介绍了android实现的计算器功能示例,可以加减乘除；可以倒退，可以清空文本，大家参考使用吧
    2014-02-02
  • 基于flutter sound插件实现录音与播放功能

    基于flutter sound插件实现录音与播放功能

    这篇文章主要介绍了基于flutter sound插件实现录音与播放功能,介绍了如何录音，如何播放本地和远程音频文件，以及如何实现动画，在录制完音频文件后如何上传，这些都是我们平常使用这个功能会遇到的问题。在使用的过程中遇到的问题也有列出，需要的朋友可以参考下
    2022-05-05
  • Android Handler内存泄漏详解及其解决方案

    Android Handler内存泄漏详解及其解决方案

    在android开发过程中，我们可能会遇到过令人奔溃的OOM异常，这篇文章主要介绍了Android Handler内存泄漏详解及其解决方案，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-08-08
  • Android与JS相互调用的方法

    Android与JS相互调用的方法

    这篇文章主要介绍了Android与JS相互通信的方法，帮助大家更好的理解和学习使用Android开发，感兴趣的朋友可以了解下
    2021-04-04
  • 详解android.mk中引用第三方库的方法

    详解android.mk中引用第三方库的方法

    本篇文章主要介绍了详解android.mk中引用第三方库的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2018-05-05
  • android Bitmap圆角与倒影的具体实现代码

    android Bitmap圆角与倒影的具体实现代码

    android Bitmap圆角与倒影的具体实现代码，需要的朋友可以参考一下
    2013-06-06
  • RecyclerView实现查看更多及收起

    RecyclerView实现查看更多及收起

    这篇文章主要为大家详细介绍了RecyclerView实现查看更多及收起，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2018-01-01
  • Android Studio3.0新特性及安装图文教程

    Android Studio3.0新特性及安装图文教程

    这篇文章主要为大家详细介绍了Android Studio3.0安装配置方法图文教程，以及Android Studio3.0新特性，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-10-10

最新评论