Android 布局崩溃

Android layout collapse

我使用 XWalkView to load webpage and a IjkVideoView 在我的应用程序中播放实时视频。我想让 IjkVideoView 在 XwalkView 前面播放视频,所以我把这两个视图放在一个 relativelayout 中,IijVideoView 在 XWalkView 后面。

在 android 工作室的设计组件树 window 中,布局似乎没问题,如下图所示,

而当我 运行 我的设备中的应用程序时,布局很乱,如下图所示。可以看到IjkVieoView的背景在XWalkView的前面,但是IjkVideoView播放的视频在XWalkView的后面,因为视频的上半部分已经被XWalkView遮住了。

布局xml,

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:ignore="UselessParent">

        <!-- This could be your fragment container, or something -->

        <org.xwalk.core.XWalkView xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/xWalkView"
            android:layout_width="fill_parent"
            android:layout_height="160dp"
            android:background="@color/blue"
            android:isScrollContainer="true">

        </org.xwalk.core.XWalkView>

        <com.xxxxxx.app.widget.media.IjkVideoView
            android:id="@+id/video_view"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="72dp"
            android:background="@color/colorAccent" />

        <com.roughike.bottombar.BottomBar
            android:id="@+id/bottomBar"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:layout_alignParentBottom="true"
            app:bb_tabXmlResource="@xml/web_tabs" />

    </RelativeLayout>
</LinearLayout>

activityjava代码,

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        Log.d("INFO", "entered");
        setContentView(R.layout.activity_web);
        mXWalkView = (XWalkView) findViewById(R.id.xWalkView);
        XWalkSettings webSettings = mXWalkView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        mXWalkView.addJavascriptInterface(new JsInterface(), "NativeInterface");

        videoView = (IjkVideoView) findViewById(R.id.video_view);
        videoView.setAspectRatio(IRenderView.AR_ASPECT_FILL_PARENT);
        videoView.setVideoURI(Uri.parse("http://live.xxxxxx.com/live/40xx27.flv"));
        videoView.start();

        final Bundle extras = getIntent().getExtras();
        mXWalkView.load("http://xxxxxxxxxxxxxx", null);
}

您的布局似乎是正确的。它可能从库中被破坏。它已经有 1k+ 个问题。

也许您可以使用包含视频的自定义对话框并显示该对话框。这样视频就会在图像前面。那么你可以尝试去除阴影或bgColor = transparent,这样用户可能不会意识到这是一个对话框。这个 hack 可能有用。

我认为这是由于相对布局。为什么不使用 Frame Layout 来尝试此代码。设计应用程序用户界面最方便和可维护的方法是创建 XML 布局资源。这种方法大大简化了用户界面设计过程,将用户界面控件的大部分静态创建和布局以及控件属性的定义移至 XML,而不是乱扔代码。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 
    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:orientation="vertical" 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<FrameLayout
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" >
    <org.xwalk.core.XWalkView 
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/xWalkView"
        android:layout_width="fill_parent"
        android:layout_height="160dp"
        android:background="@color/blue"
        android:isScrollContainer="true">
    </org.xwalk.core.XWalkView>

    <com.xxxxxx.app.widget.media.IjkVideoView
        android:id="@+id/video_view"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="72dp"
        android:layout_gravity="Bottom"
        android:gravity="center"
        android:background="@color/colorAccent" />

    <com.roughike.bottombar.BottomBar
        android:id="@+id/bottomBar"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        app:bb_tabXmlResource="@xml/web_tabs" />

       </FrameLayout>
  </LinearLayout>
 <?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:ignore="UselessParent">

        <!-- This could be your fragment container, or something -->

        <org.xwalk.core.XWalkView xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/xWalkView"
            android:layout_width="fill_parent"
            android:layout_height="160dp"
            android:background="@color/blue"
            android:elevation="5dp"
            android:isScrollContainer="true">

        </org.xwalk.core.XWalkView>

        <com.xxxxxx.app.widget.media.IjkVideoView
            android:id="@+id/video_view"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:elevation="10dp"
            android:layout_alignParentTop="true"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="72dp"
            android:background="@color/colorAccent" />

        <com.roughike.bottombar.BottomBar
            android:id="@+id/bottomBar"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:elevation="5dp"
            android:layout_alignParentBottom="true"
            app:bb_tabXmlResource="@xml/web_tabs" />

    </RelativeLayout>
</LinearLayout>

试试这个布局我用海拔修改它可能会帮助you.I有同样的问题通过使用它解决的海拔。