需要一种向此 android xamarin 示例添加按钮的方法

Question

我在这里使用了这个示例：https://github.com/xamarin/xamarin-forms-samples/blob/master/CustomRenderers/View/Droid/CameraPreview.cs

获取有关我的项目的摄像头信息。在 IOS 部分，我轻松地在相机源上添加了一个拍照按钮。我试图在 android 端做同样的事情，但我找不到如何做到这一点的方法......我尝试的一切都呈现空白页面或抛出错误。

在此相机源上添加按钮的最简单方法是什么？提前致谢

Answer 1

您可以在MainPage 中使用RelativeLayout。然后将Button 和CameraPreview 添加到其中。例如：

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
             xmlns:local="clr-namespace:CustomRenderer;assembly=CustomRenderer"
             x:Class="CustomRenderer.MainPage"
             Padding="0,20,0,0"
             Title="Main Page">
    <ContentPage.Content>
        <RelativeLayout>
            <local:CameraPreview
                Camera="Rear"  x:Name="Camera"                     
                RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
                RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent,Property=Height,Factor=1,Constant=0}"/>
            <Button x:Name="button"
                    Text="Button" Clicked="button_Clicked"
                    RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView,ElementName=Camera,Property=Height,Factor=.85,Constant=0}"
                    RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView,ElementName=Camera,Property=Width,Factor=.05,Constant=0}"
                    RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,Property=Width,Factor=.9,Constant=0}"
                    RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent,Property=Height,Factor=.125,Constant=0}" />
        </RelativeLayout>
    </ContentPage.Content>
</ContentPage>

您可以使用MessagingCenter 触发CameraPreview 的点击事件。

例如在渲染器中：

    protected override void OnElementChanged(ElementChangedEventArgs<CustomRenderer.CameraPreview> e)
    {
        base.OnElementChanged(e);

        if (Control == null)
        {
            cameraPreview = new CameraPreview(Context);

            SetNativeControl(cameraPreview);

            MessagingCenter.Subscribe<MainPage>(this, "ButtonClick", (sender) => {
                if (cameraPreview.IsPreviewing)
                {
                    cameraPreview.Preview.StopPreview();
                    cameraPreview.IsPreviewing = false;
                }
                else
                {
                    cameraPreview.Preview.StartPreview();
                    cameraPreview.IsPreviewing = true;
                }
            });
        }

        if (e.OldElement != null)
        {
            // Unsubscribe
            cameraPreview.Click -= OnCameraPreviewClicked;
        }
        if (e.NewElement != null)
        {
            Control.Preview = Camera.Open((int)e.NewElement.Camera);
            // Subscribe
            cameraPreview.Click += OnCameraPreviewClicked;
        }
    }

并且在Button点击事件中：

    private void button_Clicked(object sender, System.EventArgs e)
    {
        MessagingCenter.Send<MainPage>(this, "ButtonClick");
    }

Answer 2

这对我有用。 在 CameraPreview 类中只需添加一个新的 View 成员（cameraLayoutView）和一个按钮：

public sealed class CameraPreview : ViewGroup, ISurfaceHolderCallback
{
    View cameraLayoutView;
    global::Android.Widget.Button takePhotoButton;
}

然后在构造函数中实例化这个视图和按钮：

public CameraPreview (Context context)
            : base (context)
{
    surfaceView = new SurfaceView (context);
    AddView (surfaceView);

    Activity activity = this.Context as Activity;
    cameraLayoutView = activity.LayoutInflater.Inflate(Resource.Layout.CameraLayout, this, false);
    AddView(cameraLayoutView);

    takePhotoButton = this.FindViewById<global::Android.Widget.Button>(Resource.Id.takePhotoButton);
    takePhotoButton.Click += TakePhotoButtonTapped;

    windowManager = Context.GetSystemService (Context.WindowService).JavaCast<IWindowManager> ();

    IsPreviewing = false;
    holder = surfaceView.Holder;
    holder.AddCallback (this);
}

async void TakePhotoButtonTapped(object sender, EventArgs e)
{
       //handle the click here    
}

protected override void OnLayout (bool changed, int l, int t, int r, int b)
{
    var msw = MeasureSpec.MakeMeasureSpec (r - l, MeasureSpecMode.Exactly);
    var msh = MeasureSpec.MakeMeasureSpec (b - t, MeasureSpecMode.Exactly);

    surfaceView.Measure (msw, msh);
    surfaceView.Layout (0, 0, r - l, b - t);

    cameraLayoutView.Measure(msw, msh);
    cameraLayoutView.Layout(0, 0, r - l, b - t);
}

在 Resources/Layout 中添加此布局：

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_weight="1">
    <TextureView
        android:id="@+id/textureView"
        android:layout_marginTop="-95dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <Button
        android:id="@+id/toggleFlashButton"
        android:layout_width="37dp"
        android:layout_height="37dp"
        android:layout_gravity="top|left"
        android:layout_marginLeft="25dp"
        android:layout_marginTop="25dp"
        android:background="@drawable/NoFlashButton" />
    <Button
        android:id="@+id/switchCameraButton"
        android:layout_width="35dp"
        android:layout_height="26dp"
        android:layout_gravity="top|right"
        android:layout_marginRight="25dp"
        android:layout_marginTop="25dp"
        android:background="@drawable/ToggleCameraButton" />
    <Button
        android:id="@+id/takePhotoButton"
        android:layout_width="65dp"
        android:layout_height="65dp"
        android:layout_marginBottom="15dp"
        android:layout_gravity="center|bottom"
        android:background="@drawable/TakePhotoButton" />
</FrameLayout>

以及Resources/drawable中的按钮图标。