如何在vuforia的摄像机视图中创建按钮？

Question

我正在使用Vuforia AR sdk并希望在屏幕上的相机预览上创建一个按钮。

我无法弄清楚在哪里以及如何添加按钮。

Answer 1

我已经像这样编辑了camera_overlay_udt.xml。在我的布局设计中，我放回了按钮和列表视图。

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

    <LinearLayout
        android:id="@+id/headerLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:background="@drawable/header"
        android:orientation="horizontal" >

        <ImageButton
            android:id="@+id/backButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:background="@android:color/transparent"
            android:src="@drawable/back" />

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="match_parent" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerInParent="true"
                android:text="Swipart"
                android:textColor="@color/white"
                android:textSize="18dp"
                android:textStyle="bold" />

            <ImageButton
                android:id="@+id/arcstarButton"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:layout_alignParentRight="true"
                android:layout_centerInParent="true"
                android:layout_marginRight="10dp"
                android:background="@android:color/transparent"
                android:src="@drawable/star_button" />
        </RelativeLayout>
    </LinearLayout>

    <LinearLayout
        android:id="@+id/favListingLayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/headerLayout"
        android:gravity="top"
        android:orientation="horizontal"
        android:visibility="visible" >

        <ListView
            android:id="@+id/favlist"
            android:layout_width="120dp"
            android:layout_height="match_parent"
            android:layout_marginBottom="50dp"
            android:layout_marginLeft="7dp"
            android:cacheColorHint="#00000000" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/bottom_bar"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentRight="true"
        android:layout_marginRight="10dp"
        android:background="@color/overlay_bottom_bar_background"
        android:gravity="center_vertical"
        android:orientation="horizontal"
        android:visibility="visible"
        android:weightSum="1" >

        <View
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:background="@color/overlay_bottom_bar_separators" />

        <ImageButton
            android:id="@+id/camera_button"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@null"
            android:contentDescription="@string/content_desc_camera_button"
            android:onClick="onCameraClick"
            android:paddingBottom="10dp"
            android:paddingTop="10dp"
            android:src="@drawable/camera_button_background" />
    </LinearLayout>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_above="@id/bottom_bar"
        android:background="@color/overlay_bottom_bar_separators" />

    </RelativeLayout>

之后请编辑ImageTargets.java类

private void addOverlayView(boolean initLayout) {
    // Inflates the Overlay Layout to be displayed above the Camera View
    LayoutInflater inflater = LayoutInflater.from(this);
    mUILayouts = (RelativeLayout) inflater.inflate(
            R.layout.camera_overlay_udt, null, false);

    mUILayouts.setVisibility(View.VISIBLE);

    // If this is the first time that the application runs then the
    // uiLayout background is set to BLACK color, will be set to
    // transparent once the SDK is initialized and camera ready to draw
    if (initLayout) {
        mUILayouts.setBackgroundColor(Color.TRANSPARENT);
    }

    // Adds the inflated layout to the view
    addContentView(mUILayouts, new LayoutParams(LayoutParams.WRAP_CONTENT,
            LayoutParams.WRAP_CONTENT));

    // Gets a reference to the bottom navigation bar
    mBottomBar = mUILayouts.findViewById(R.id.bottom_bar);

    // Gets a reference to the Camera button

    mCameraButton = mUILayouts.findViewById(R.id.camera_button);
    mCameraButton.setVisibility(View.GONE);

    favButton = (ImageButton) mUILayouts.findViewById(R.id.arcstarButton);
    listview = (ListView) mUILayouts.findViewById(R.id.favlist);
    backButton = (ImageButton) mUILayouts.findViewById(R.id.backButton);

    backButton.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View paramView) {
            // TODO Auto-generated method stub
            finish();
        }
    });

    listview.setVisibility(View.GONE);

    galleryList = SendFile.getFavourites();

    if (galleryList != null) {
        gridviewAdapter = new GridviewAdapter(ImageTargets.this);

        listview.setAdapter(gridviewAdapter);
    }

    favButton.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {

            if (galleryList != null && galleryList.size() > 0) {

                if (listview.getVisibility() == View.GONE) {
                    listview.setVisibility(View.VISIBLE);
                } else {
                    listview.setVisibility(View.GONE);
                }
            } else {
                Toast.makeText(ImageTargets.this, "Favourites not fond",
                        Toast.LENGTH_LONG).show();
            }
        }
    });

    listview.setOnItemClickListener(new OnItemClickListener() {

        @Override
        public void onItemClick(AdapterView<?> paramAdapterView,
                View paramView, int positon, long paramLong) {

            SendFile.setFavourite(galleryList.get(positon));

            Intent intent = new Intent(ImageTargets.this,
                    LoadingScreen.class);
            Bundle bundle = new Bundle();
            bundle.putInt("x", x_Axis);
            bundle.putInt("y", y_Axis);
            intent.putExtras(bundle);
            startActivity(intent);
            finish();

        }
    });

    showDialogHandler = new Handler() {

        public void handleMessage(Message msg) {

            String aResponse = msg.getData().getString("message");

            if ((null != aResponse)) {

                // ALERT MESSAGE
                Toast.makeText(getBaseContext(),
                        "Server Response: " + aResponse, Toast.LENGTH_SHORT)
                        .show();

                showAlertDialog(aResponse);

            } else {

                // ALERT MESSAGE
                Toast.makeText(getBaseContext(),
                        "Not Got Response From Server.", Toast.LENGTH_SHORT)
                        .show();
            }

        };

    };

    loadingDialogHandler.captureButtonContainer = mUILayouts
            .findViewById(R.id.camera_button);

    mUILayouts.bringToFront();
}

他们使用处理程序显示布局

Answer 2

以正常方式启动相机预览。在它上面放置一个透明背景的布局：

<?xml version="1.0" encoding="utf-8"?>

 <RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:background="#ff000000"
    android:layout_height="match_parent">


    <ImageView
     android:id="@+id/start_image_button"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_marginLeft="10dp"
     android:layout_marginRight="5dp"
     android:scaleType="fitXY"
     android:layout_weight="1"
     android:src="@drawable/scan_image"/>

</RelativeLayout>

在java文件中，您可以像这样添加此布局：

private View mStartupView;
mStartupView = getLayoutInflater().inflate(
R.layout.startup_screen, null);

// Add it to the content view:
addContentView(mStartupView, new LayoutParams(
            LayoutParams.MATCH_PARENT,
            LayoutParams.MATCH_PARENT));

这样您就可以在相机预览的顶部看到您的按钮。希望它有所帮助

Answer 3

您可以在布局文件夹中的相机覆盖布局中添加按钮，并且可以初始化处于主要活动状态的initAR功能中的按钮。

Answer 4

步骤1：在camera_overlay.xml中添加按钮

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

    <ProgressBar
        style="@android:style/Widget.ProgressBar"
        android:id="@+id/loading_indicator"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="18dp"
        android:layout_marginTop="51dp"
        android:text="Button" />

 </RelativeLayout>

第2步：编辑ImageTargets.java类

private static final String LOGTAG = "ImageTargets";
private Button b1;

步骤3：修改ImageTargets.java类的

的initApplicationAR（）函数

private void initApplicationAR()
{
    // Create OpenGL ES view:
    int depthSize = 16;
    int stencilSize = 0;
    boolean translucent = Vuforia.requiresAlpha();

    mGlView = new SampleApplicationGLView(this);
    mGlView.init(translucent, depthSize, stencilSize);

    mRenderer = new ImageTargetRenderer(this, vuforiaAppSession);
    mRenderer.setTextures(mTextures);
    mGlView.setRenderer(mRenderer);

    b1 = (Button) findViewById(R.id.button1);
    b1.setOnClickListener(new View.OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            b1.setVisibility(View.GONE);
        }
    });

}

现在躺下来，看一下按钮就会消失！

Answer 5

虽然从帖子开始已经很久了..但我找到了一篇文章......其中你可以得到所需的东西..

参考：https://medium.com/nosort/adding-views-on-top-of-unityplayer-in-unityplayeractivity-e76240799c82

解决方案：

步骤1：制作自定义布局XML文件（vuforia_widget_screen.xml）。例如，已添加按钮。

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

    <FrameLayout
        android:id="@+id/unity_player_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <Button
        android:id="@+id/back_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:background="@null"
        android:text="@string/welcome" />
</FrameLayout>

第2步：在UnityPlayerActivity.java中进行以下更改

替换＆＃34; setContentView(mUnityPlayer);＆＃34;与

setContentView(R.layout.vuforia_widget_screen);
FrameLayout frameLayout = findViewById(R.id.unity_player_layout);
frameLayout.addView(mUnityPlayer.getView());

- ＆GT;对于任何将来都会面临这个问题的人。 ：）