Android 怎么实现左侧固定菜单栏，右侧webview

荼酪 2020-06-23 09:30:06
想做一个pad版的，左侧菜单栏， 右侧webview实现，这两个视图都写好了，但是就是不知道怎么实现2个视图在pad上显示在一个页面上（一个左侧一个右侧，没有思路，不知道怎么实现，有大神能给点思路吗，万分感谢）
...全文
1484 18 打赏 收藏 转发到动态 举报
写回复
用AI写文章
18 条回复
切换为时间正序
请发表友善的回复…
发表回复
weixin_44940981 2022-02-23
  • 打赏
  • 举报
 回复

老哥，有这个页面的源码吗？

clearlove66666 2020-06-24
  • 打赏
  • 举报
 回复
可以啊有点东西的
初学者-Study 2020-06-23
  • 打赏
  • 举报
 回复
引用 6 楼 Kung_Moon 的回复:
引用 4 楼 JMSissi 的回复:
把页面用权重比分成两部分啊
权重已经设置好了，在xml视图文件中都设置好了，但是我运行项目发现左侧的菜单栏不显示，webview占满屏幕了
JMSissi 2020-06-23
  • 打赏
  • 举报
 回复
引用 16 楼 Kung_Moon 的回复:
[quote=引用 15 楼 JMSissi 的回复:] [quote=引用 14 楼 Kung_Moon 的回复:] [quote=引用 13 楼 JMSissi 的回复:] 你的布局文件写错了

Web所在的LinearLayout的宽度不应该match_parent
改成wrap_content
大佬，改成wrap_content提示错误了：Placing a <WebView> in a parent element that uses a wrap_content layout_width can lead to subtle bugs; use match_parent instead (wrap_content here may not work well with WebView below)[/quote] 

 <LinearLayout
        android:layout_width="80dp"
        android:layout_height="match_parent"
        android:background="#FF39CFAA"
        android:orientation="vertical">

        <!--首页-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView1"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="我的"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--报表-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView2"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="报表"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--待办-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView3"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="待办"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--我的-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView4"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="我的"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <WebView
            android:id="@+id/home_webview"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>
帮你改好了[/quote]感谢大佬，现在APP运行加载webview网页还是没有左侧菜单栏，大佬，能加你qq或者微信沟通下吗，万分感谢[/quote] 我不是私信你了吗 看私信加
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 15 楼 JMSissi 的回复:
[quote=引用 14 楼 Kung_Moon 的回复:] [quote=引用 13 楼 JMSissi 的回复:] 你的布局文件写错了

Web所在的LinearLayout的宽度不应该match_parent
改成wrap_content
大佬，改成wrap_content提示错误了：Placing a <WebView> in a parent element that uses a wrap_content layout_width can lead to subtle bugs; use match_parent instead (wrap_content here may not work well with WebView below)[/quote] 

 <LinearLayout
        android:layout_width="80dp"
        android:layout_height="match_parent"
        android:background="#FF39CFAA"
        android:orientation="vertical">

        <!--首页-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView1"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="我的"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--报表-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView2"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="报表"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--待办-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView3"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="待办"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--我的-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView4"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="我的"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <WebView
            android:id="@+id/home_webview"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>
帮你改好了[/quote]感谢大佬，现在APP运行加载webview网页还是没有左侧菜单栏，大佬，能加你qq或者微信沟通下吗，万分感谢
JMSissi 2020-06-23
  • 打赏
  • 举报
 回复
引用 14 楼 Kung_Moon 的回复:
[quote=引用 13 楼 JMSissi 的回复:] 你的布局文件写错了

Web所在的LinearLayout的宽度不应该match_parent
改成wrap_content
大佬，改成wrap_content提示错误了：Placing a <WebView> in a parent element that uses a wrap_content layout_width can lead to subtle bugs; use match_parent instead (wrap_content here may not work well with WebView below)[/quote] 

 <LinearLayout
        android:layout_width="80dp"
        android:layout_height="match_parent"
        android:background="#FF39CFAA"
        android:orientation="vertical">

        <!--首页-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView1"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="我的"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--报表-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView2"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="报表"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--待办-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView3"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="待办"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

        <!--我的-->
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="50dp"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/imageView4"

                android:layout_width="30dp"
                android:layout_height="30dp"
                android:layout_gravity="center" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="10px"
                android:text="我的"
                android:textColor="#FFFFFF"
                android:textSize="18sp" />
        </LinearLayout>

    </LinearLayout>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="vertical">

        <WebView
            android:id="@+id/home_webview"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>
帮你改好了
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 13 楼 JMSissi 的回复:
你的布局文件写错了

Web所在的LinearLayout的宽度不应该match_parent
改成wrap_content
大佬，改成wrap_content提示错误了：Placing a <WebView> in a parent element that uses a wrap_content layout_width can lead to subtle bugs; use match_parent instead (wrap_content here may not work well with WebView below)
JMSissi 2020-06-23
  • 打赏
  • 举报
 回复
你的布局文件写错了

Web所在的LinearLayout的宽度不应该match_parent
改成wrap_content
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 10 楼 JMSissi 的回复:
引用 6 楼 Kung_Moon 的回复:
引用 4 楼 JMSissi 的回复:
把页面用权重比分成两部分啊
权重已经设置好了，在xml视图文件中都设置好了，但是我运行项目发现左侧的菜单栏不显示，webview占满屏幕了
不然凭空想象 无中生有嘛
这是视图文件 
 
<LinearLayout
              android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal">
<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="9"
            android:orientation="vertical"
            android:background="#FF39CFAA"

    >



        <!--首页-->
        <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

            <ImageView
                    android:id="@+id/imageView1"

                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_home"
            />
            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:text="我的"
                      android:textSize="18sp"
                      android:textColor="#FFFFFF"
                      android:layout_marginTop="10px"/>
        </LinearLayout>


        <!--报表-->
        <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

            <ImageView
                    android:id="@+id/imageView2"

                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_baobiao"
            />
            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:text="报表"
                      android:textSize="18sp"
                      android:textColor="#FFFFFF"
                      android:layout_marginTop="10px"/>
        </LinearLayout>



        <!--待办-->
        <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

            <ImageView
                    android:id="@+id/imageView3"

                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_daiban"
            />
            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:text="待办"
                      android:textSize="18sp"
                      android:textColor="#FFFFFF"
                      android:layout_marginTop="10px"/>
        </LinearLayout>


        <!--我的-->
        <LinearLayout
                android:layout_width="fill_parent"
                android:layout_height="50dp"
                android:layout_weight="1"
                android:gravity="center"
                android:orientation="vertical">

            <ImageView
                    android:id="@+id/imageView4"

                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_me"
            />
            <TextView android:layout_width="wrap_content"
                      android:layout_height="wrap_content"
                      android:text="我的"
                      android:textSize="18sp"
                      android:textColor="#FFFFFF"
                      android:layout_marginTop="10px"/>
        </LinearLayout>

    </LinearLayout>
    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical">
        <WebView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:id="@+id/home_webview"
                />

    </LinearLayout>
    </LinearLayout>
这是java代码层

        //设置隐藏标题栏
        getSupportActionBar().hide();

        //设置当前窗口全屏展示
  getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);
       
        webView = new WebView(this);

        // iew属性，能够执行Javascript脚本
        webView.getSettings().setJavaScriptEnabled(true);
        webView.getSettings().setAllowFileAccessFromFileURLs(true);
        webView.getSettings().setAllowUniversalAccessFromFileURLs(true);


        webseve = WebSettings.LayoutAlgorithm.NARROW_COLUMNS;//适应内容大小
        webseve = WebSettings.LayoutAlgorithm.SINGLE_COLUMN;//适应屏幕，内容自动缩放


        //加载需要显示的网页
        webView.loadUrl("https://www.baidu.com");
        //设置权限禁止跳转到内置浏览器
        webView.setWebViewClient(new WebViewClient() {

            @RequiresApi(api = Build.VERSION_CODES.N)
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                if (url.startsWith("http://") || url.startsWith("https://")) {
                    return false;
                } else {
                    try {
                        if (url.startsWith("baidumap://")) {
                            Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                            startActivity(intent);
                            return true;
                        }
                    } catch (Exception e) {
                        return false;
                    }
                }

                webView.loadUrl(url);
                return true;
            }

        });




        webView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(final WebView view, final String url) {

                if (url.startsWith("http://") || url.startsWith("https://")) {
                    view.loadUrl(url);
                    return false;
                } else {
                    try {
                        Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
                        startActivity(intent);
                    } catch (Exception e) {
                        e.printStackTrace();
                    }
                    return true;
                }
            }


        });
         //设置Web视图
        setContentView(webView);


        }
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        if((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack() ){
            webView.goBack();
            return  true;
            }  return super.onKeyDown(keyCode, event);
        }
辛苦大佬看下
JMSissi 2020-06-23
  • 打赏
  • 举报
 回复
引用 6 楼 Kung_Moon 的回复:
引用 4 楼 JMSissi 的回复:
把页面用权重比分成两部分啊
权重已经设置好了，在xml视图文件中都设置好了，但是我运行项目发现左侧的菜单栏不显示，webview占满屏幕了
不然凭空想象 无中生有嘛
JMSissi 2020-06-23
  • 打赏
  • 举报
 回复
引用 6 楼 Kung_Moon 的回复:
引用 4 楼 JMSissi 的回复:
把页面用权重比分成两部分啊
权重已经设置好了，在xml视图文件中都设置好了，但是我运行项目发现左侧的菜单栏不显示，webview占满屏幕了
那可以把代码贴出来不
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 楼主 Kung_Moon 的回复:
想做一个pad版的，左侧菜单栏， 右侧webview实现，这两个视图都写好了，但是就是不知道怎么实现2个视图在pad上显示在一个页面上（一个左侧一个右侧，没有思路，不知道怎么实现，有大神能给点思路吗，万分感谢）
说一下，我视图那webview和菜单栏已经实现了，只是在运行APP过程中只展示webview视图，不显示菜单栏部分，权重已经设置好了
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 5 楼 立青_ 的回复:
引用 3 楼 Kung_Moon 的回复:
引用 1 楼 初学者-Study 的回复:
通过布局就可以简单实现啊，左侧的菜单可以通过列表来实现效果，然后点击之后传递数据到右侧WebView中显示就可以了啊
左侧布局是不能在webview视图上嵌套，所以不知道怎么实现，能加QQ私聊下吗，万分感谢
最简单一个线性布局，左边菜单，右边一个WebView，你要怎么嵌套？
你说的这些我已经弄好了，只是在APP运行过程中只展示了webview，没有左侧菜单栏
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 4 楼 JMSissi 的回复:
把页面用权重比分成两部分啊
权重已经设置好了，在xml视图文件中都设置好了，但是我运行项目发现左侧的菜单栏不显示，webview占满屏幕了
立青_ 中级 2020-06-23
  • 打赏
  • 举报
 回复
引用 3 楼 Kung_Moon 的回复:
引用 1 楼 初学者-Study 的回复:
通过布局就可以简单实现啊，左侧的菜单可以通过列表来实现效果，然后点击之后传递数据到右侧WebView中显示就可以了啊
左侧布局是不能在webview视图上嵌套，所以不知道怎么实现，能加QQ私聊下吗，万分感谢
最简单一个线性布局，左边菜单，右边一个WebView，你要怎么嵌套？
JMSissi 2020-06-23
  • 打赏
  • 举报
 回复
把页面用权重比分成两部分啊
荼酪 2020-06-23
  • 打赏
  • 举报
 回复
引用 1 楼 初学者-Study 的回复:
通过布局就可以简单实现啊，左侧的菜单可以通过列表来实现效果，然后点击之后传递数据到右侧WebView中显示就可以了啊
左侧布局是不能在webview视图上嵌套，所以不知道怎么实现，能加QQ私聊下吗，万分感谢
初学者-Study 2020-06-23
  • 打赏
  • 举报
 回复
通过布局就可以简单实现啊，左侧的菜单可以通过列表来实现效果，然后点击之后传递数据到右侧WebView中显示就可以了啊
Android自定义View 顶部导航栏
Activity中最常见的页面结构就是顶部返回键+标题（+副标题）+右侧的菜单/编辑按钮/“提交”/“发布”，将此结构封装并设置多个属性，使用时一个View即可搞定。 实现效果 图一实现代码 <包名.widgets.NavBar android:id="@+id/nav_bar" android:layout_width="match_parent" android:layout_height="wrap_content" app:l
Android 设备WebView远程调试
声明：本文主要介绍chrome 的inspect 实现的远程调试。要求 Android 4.4 (KitKat) 以上并能开启webview渲染，chrome 版本 32++(建议最新版本)。大部分内容来自谷歌开发者网站，部分图片来自老版本的chrome，但大体上一样。 如果低于上面的硬件要求可以通过weinre来调试，详情见文章。https://segmentfault.com/a/1190
android webview可以缩放,是否可以禁用Android webview中的所有滚动和缩放？
我试图找到答案,但迄今为止失败了.我有一个使用WebView的活动.显示给用户的所有内容都以HT​​ML和JavaScript呈现.也就是说,WebView可以获取所有屏幕. APK用于存储某些持久数据并启动WebView.用户界面底部有一个基于图标的导航菜单(屏幕底部有5个图标),顶部有一些视觉元素(徽标图像和搜索按钮).顶部元素和底部导航栏之间的所有内容都可以根据用户操作进行更改,刷新或更新....
android界面设计（一）侧边栏的两种实现方式
dome：https://github.com/linliangliang/sidebar 一、使用slideingMenu结合fragment实现。 二、使用Navigation和DrawerLayout实现。 第二种实现方式：https://mp.csdn.net/postedit/84613568 1、下面介绍使用sideingMenu的方式实现侧边栏。 主界面activity_m...
Webview模块管理应用窗口界面，实现多窗口的逻辑控制管理操作（中1）
Webview模块管理应用窗口界面，实现多窗口的逻辑控制管理操作（中1）
Android

80,359

社区成员

91,290

社区内容

发帖
与我相关
我的任务
社区描述
移动平台 Android
androidandroid-studioandroidx 技术论坛（原bbs）
社区管理员
  • Android
  • yechaoa
  • 失落夏天
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章