Question

我正在尝试创建一个类似于Youtube播放器的Android视频播放器。我将按照以下步骤创建播放器：

设计的最佳布局。
VideoPlayer的中间布局（surfaceView）。
进度条的底部布局（提示：所有布局都是动态创建的）

这是我要求的模板。

我面临的问题是SurfaceView占据了显示器的全长。它隐藏了顶部和底部布局。

我可以做些什么来制作顶部和底部布局？

Answer 1

这就是我动态定位曲面视图的方法。也许拥有更多UI知识的人会做一些不同的事情......我希望看到。

        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);

            // Create objects.
            try {
                mCamera = Camera.open();
            }
            catch (Exception e) {
                Log.e("onCreate", "could not open camera", e);
            }
            mLiveGraphView = new LiveGraphView(this);
            mCameraPreview = new CameraPreview(this, mCamera);

            // Create RelativeLayout for layout root.
            mLayoutRoot = new RelativeLayout(this);
            RelativeLayout.LayoutParams rlp = new RelativeLayout.LayoutParams(
                    RelativeLayout.LayoutParams.MATCH_PARENT,
                    RelativeLayout.LayoutParams.MATCH_PARENT);

            // Add GraphView to layout.
            RelativeLayout.LayoutParams lpGraph = new RelativeLayout.LayoutParams(
                    RelativeLayout.LayoutParams.MATCH_PARENT,
                    RelativeLayout.LayoutParams.MATCH_PARENT);
            mLiveGraphView.setLayoutParams(lpGraph);
            mLayoutRoot.addView(mLiveGraphView);

            // Add SurfaceView to layout.
            List<Camera.Size> ls = mCamera.getParameters().getSupportedPreviewSizes();
            int n = ls.size();
            int widthMin = 10000;
            int imin = -1;
            for (int i=0; i<n; i++) {
                if (DEBUG)
                    Log.d(TAG, "supported preview width x height: " + ls.get(i).width + " x " + ls.get(i).height);
                if (widthMin > ls.get(i).width) {
                    widthMin = ls.get(i).width;
                    mCameraPreviewSize = ls.get(i);
                    imin = i;
                }
            }
            if (imin >= 0) {
                Camera.Parameters parameters = mCamera.getParameters();
                parameters.setPreviewSize(mCameraPreviewSize.width, mCameraPreviewSize.height);
                parameters.setFocusMode(Camera.Parameters.FOCUS_MODE_INFINITY);
                parameters.setWhiteBalance(Camera.Parameters.WHITE_BALANCE_DAYLIGHT);
                parameters.setSceneMode(Camera.Parameters.SCENE_MODE_SPORTS);
                parameters.setFlashMode(Camera.Parameters.FLASH_MODE_OFF);
                mCamera.setParameters(parameters);

                RelativeLayout.LayoutParams lpSurface = new RelativeLayout.LayoutParams(
                        ls.get(imin).width, ls.get(imin).height);
                lpSurface.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
                lpSurface.addRule(RelativeLayout.CENTER_HORIZONTAL);
                mCameraPreview.setLayoutParams(lpSurface);
                mLayoutRoot.addView(mCameraPreview);
            }

            // Provide Android framework with layout root.
            setContentView(mLayoutRoot, rlp);
        }

Answer 2

您使用什么作为父布局？顶视图和底视图中的任何一个应该叠加在VideoView的顶部（这是YouTube的作用）吗？

以下是使用RelativeLayout的示例布局，显示了这种方法:(注意：ViewGroups的位置很重要，它决定哪些视图“在顶部”与“在”下方。靠近文件底部的ViewGroups更高“on顶部“）

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

    <VideoView
        android:id="@+id/videoView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />

    <LinearLayout
        android:id="@+id/linearLayoutTop"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="This is the top container!" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/linearLayoutBottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="This is the bottom container!" />
    </LinearLayout>

</RelativeLayout>

如果您不希望顶视图和底视图重叠，可以使用LinearLayout（具有垂直方向和适当的layout_heights）：

<?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" >

    <LinearLayout
        android:id="@+id/linearLayoutTop"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="This is the top container!" />
    </LinearLayout>

    <VideoView
        android:id="@+id/videoView1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <LinearLayout
        android:id="@+id/linearLayoutBottom"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="This is the bottom container!" />
    </LinearLayout>

</LinearLayout>

Android视频播放器采用小型布局

2 个答案: