【Android UI】侧滑栏的使用(HorizontalScrollView控件的使用)

简介: 主要的用到的控件:HorizontalScrollView 主要的功能:把几张图片解析成一张图片,在一个容器中呈现。 布局文件xml side_bar_scollview.xml//显示view的容器 home.

主要的用到的控件:HorizontalScrollView

主要的功能:把几张图片解析成一张图片,在一个容器中呈现。

布局文件xml

side_bar_scollview.xml//显示view的容器

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <HorizontalScrollView
        android:id="@+id/MyScrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <LinearLayout
            android:id="@+id/ll_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal" >
        </LinearLayout>
        
    </HorizontalScrollView>

</LinearLayout>

home.xml//显示的主页面

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" 
    android:background="@drawable/home_bg">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="主页" />

</LinearLayout>

menu.xml//显示的菜单页面

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" 
    android:background="@drawable/menu_bg">

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="菜单" />

</FrameLayout>

MainActivity.java//主活动

package com.example.side_bar_scrollview;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;


public class MainActivity extends Activity {

    private HorizontalScrollView scrollview;
    private LinearLayout view_layout;
    private int width;
    private int height;
    private View home_view;
    private View menu_view;
    private float rate=0.4f;
    
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //关联界面ID
        setContentView(R.layout.side_bar_scollview);
        //关联控件ID
        scrollview=(HorizontalScrollView) findViewById(R.id.MyScrollView);
        view_layout=(LinearLayout) findViewById(R.id.ll_layout);
        //监听布局
        MyLayoutListener();
        //隐藏滚动条
        scrollview.setHorizontalScrollBarEnabled(false);
    }

    /**
     * 监听布局的变化
     *  1.getViewTreeObserver --- view事件的观察者
     *   2.addOnGlobalLayoutListener
     * 当在一个视图树中全局布局发生改变或者视图树中的某个视图的可视状态发生改变时,
     * 所要调用的回调函数的接口类
     *
     */
        private void MyLayoutListener(){
        
        scrollview.getViewTreeObserver().addOnGlobalLayoutListener(
                new OnGlobalLayoutListener() {

            @Override
            public void onGlobalLayout() {
                // TODO Auto-generated method stub
                //移除之前已经注册的全局布局的回调函数,使图片不会循环连在一起
                view_layout.getViewTreeObserver()
                    .removeOnGlobalLayoutListener(this);
                //获取最后一次调用measure()测量得到的scrollview的宽和高
                height = scrollview.getMeasuredHeight();
                width = scrollview.getMeasuredWidth();
                //解析主页和菜单的布局
                home_view=getLayoutInflater().inflate(R.layout.home,
                        null);
                menu_view=getLayoutInflater().inflate(R.layout.menu,
                        null);
                //添加view到view_layout
                view_layout.addView(menu_view, (int)(width*rate), height);
                view_layout.addView(home_view, width, height);
                
            }
        });
        
    }

}

效果图:

 

遗失的拂晓
目录
相关文章
|
2月前
|
搜索推荐 Android开发 开发者
探索安卓开发中的自定义视图:打造个性化UI组件
【10月更文挑战第39天】在安卓开发的世界中,自定义视图是实现独特界面设计的关键。本文将引导你理解自定义视图的概念、创建流程,以及如何通过它们增强应用的用户体验。我们将从基础出发,逐步深入,最终让你能够自信地设计和实现专属的UI组件。
|
12天前
|
移动开发 前端开发 Java
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
JavaFX是Java的下一代图形用户界面工具包。JavaFX是一组图形和媒体API,我们可以用它们来创建和部署富客户端应用程序。 JavaFX允许开发人员快速构建丰富的跨平台应用程序,允许开发人员在单个编程接口中组合图形,动画和UI控件。本文详细介绍了JavaFx的常见用法,相信读完本教程你一定有所收获!
Java最新图形化界面开发技术——JavaFx教程(含UI控件用法介绍、属性绑定、事件监听、FXML)
|
7天前
|
前端开发 Linux C#
一款开源、免费、美观的 Avalonia UI 原生控件库 - Semi Avalonia
一款开源、免费、美观的 Avalonia UI 原生控件库 - Semi Avalonia
38 10
|
1月前
|
XML 搜索推荐 前端开发
安卓开发中的自定义视图:打造个性化UI组件
在安卓应用开发中,自定义视图是一种强大的工具,它允许开发者创造独一无二的用户界面元素,从而提升应用的外观和用户体验。本文将通过一个简单的自定义视图示例,引导你了解如何在安卓项目中实现自定义组件,并探讨其背后的技术原理。我们将从基础的View类讲起,逐步深入到绘图、事件处理以及性能优化等方面。无论你是初学者还是有经验的开发者,这篇文章都将为你提供有价值的见解和技巧。
|
2月前
|
XML 前端开发 Android开发
Android:UI:Drawable:View/ImageView与Drawable
通过本文的介绍,我们详细探讨了Android中Drawable、View和ImageView的使用方法及其相互关系。Drawable作为图像和图形的抽象表示,提供了丰富的子类和自定义能力,使得开发者能够灵活地实现各种UI效果。View和ImageView则通过使用Drawable实现了各种图像和图形的显示需求。希望本文能为您在Android开发中使用Drawable提供有价值的参考和指导。
46 2
|
2月前
|
人工智能 API Apache
推荐3款开源、美观且免费的WinForm UI控件库
推荐3款开源、美观且免费的WinForm UI控件库
326 6
|
2月前
|
API C# 开发者
基于Material Design风格开源、免费的WinForms UI控件库
基于Material Design风格开源、免费的WinForms UI控件库!
|
3月前
|
Linux C# Android开发
分享3款开源、免费的Avalonia UI控件库
分享3款开源、免费的Avalonia UI控件库
288 0
|
4月前
|
XML Android开发 UED
💥Android UI设计新风尚!掌握Material Design精髓,让你的界面颜值爆表!🎨
随着移动应用市场的蓬勃发展,用户对界面设计的要求日益提高。为此,掌握由Google推出的Material Design设计语言成为提升应用颜值和用户体验的关键。本文将带你深入了解Material Design的核心原则,如真实感、统一性和创新性,并通过丰富的组件库及示例代码,助你轻松打造美观且一致的应用界面。无论是色彩搭配还是动画效果,Material Design都能为你的Android应用增添无限魅力。
95 1
|
3月前
|
XML 存储 Java
浅谈Android的TextView控件
浅谈Android的TextView控件
49 0