fix(google-signin): handle button tap

Author: triniwiz

apps/demo/src/plugin-demos/google-signin.ts

@@ -1,12 +1,15 @@
 import { Observable, EventData, Page } from '@nativescript/core';
 import { DemoSharedGoogleSignin } from '@demo/shared';
-import { } from '@nativescript/google-signin';
+import {} from '@nativescript/google-signin';
 
 export function navigatingTo(args: EventData) {
 	const page = <Page>args.object;
 	page.bindingContext = new DemoModel();
 }
 
 export class DemoModel extends DemoSharedGoogleSignin {
-	
+	signInTapped(args) {
+		console.log('signInTapped');
+		this.testIt();
+	}
 }

apps/demo/src/plugin-demos/google-signin.xml

@@ -1,4 +1,6 @@
-<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" class="page">
+<Page xmlns="http://schemas.nativescript.org/tns.xsd"
+xmlns:ui="@nativescript/google-signin"
+ navigatingTo="navigatingTo" class="page">
     <Page.actionBar>
         <ActionBar title="google-signin" icon="" class="action-bar">
         </ActionBar>
@@ -7,7 +9,7 @@
         <ScrollView class="h-full">
           <StackLayout>
             <Button text="Test google-signin" tap="{{ testIt }}" class="btn btn-primary"/>
-
+            <ui:GoogleSignInButton tap="{{ signInTapped }}"/>
           </StackLayout>
         </ScrollView>
     </StackLayout>

packages/google-signin/common.ts

@@ -48,6 +48,8 @@ export const colorStyleProperty = new Property<GoogleSignInButtonBase, ColorStyl
 
 @CSSType('GoogleSignInButton')
 export class GoogleSignInButtonBase extends View {
+	public static tapEvent = 'tap';
+
 	colorScheme: ColorSchemeType;
 	colorStyle: ColorStyleType;
 }

packages/google-signin/index.android.ts

@@ -1,4 +1,3 @@
-// @ts-nocheck
 import { AndroidApplication, Application, AndroidActivityResultEventData, Utils } from '@nativescript/core';
 import { colorSchemeProperty, ColorSchemeType, colorStyleProperty, ColorStyleType, Configuration, GoogleSignInButtonBase, IUser } from './common';
 import lazy from '@nativescript/core/utils/lazy';
@@ -251,11 +250,43 @@ export class GoogleSignin {
 	}
 }
 
+@NativeClass
+@Interfaces([android.view.View.OnClickListener])
+class ClickListenerImpl extends java.lang.Object implements android.view.View.OnClickListener {
+	constructor(public owner: GoogleSignInButton) {
+		super();
+
+		return global.__native(this);
+	}
+
+	public onClick(v: android.view.View): void {
+		const owner = this.owner;
+		if (owner) {
+			owner._emit(GoogleSignInButton.tapEvent);
+		}
+	}
+}
+
 export class GoogleSignInButton extends GoogleSignInButtonBase {
 	createNativeView() {
 		return new com.google.android.gms.common.SignInButton(this._context);
 	}
 
+	initNativeView(): void {
+		super.initNativeView();
+		const nativeView = this.nativeViewProtected as com.google.android.gms.common.SignInButton;
+		const clickListener = new ClickListenerImpl(this);
+		nativeView.setOnClickListener(clickListener);
+		(<any>nativeView).clickListener = clickListener;
+	}
+
+	public disposeNativeView() {
+		if ((<any>this.nativeViewProtected)?.clickListener) {
+			(<any>this.nativeViewProtected).clickListener.owner = null;
+		}
+		super.disposeNativeView();
+	}
+
 	[colorSchemeProperty.setNative](value: ColorSchemeType) {
 		const nativeView: com.google.android.gms.common.SignInButton = this.nativeView;
 		switch (value) {

packages/google-signin/index.ios.ts

@@ -1,4 +1,4 @@
-import { Application, Utils } from '@nativescript/core';
+import { Application, Utils, View } from '@nativescript/core';
 import { colorSchemeProperty, ColorSchemeType, colorStyleProperty, ColorStyleType, Configuration, GoogleSignInButtonBase, IUser } from './common';
 
 export class GoogleError extends Error {
@@ -261,12 +261,21 @@ export class GoogleSignin {
 }
 
 export class GoogleSignInButton extends GoogleSignInButtonBase {
+	private _tapHandler: NSObject;
+
 	createNativeView() {
 		return GIDSignInButton.new();
 	}
 
-	initNativeView() {
+	public initNativeView(): void {
 		super.initNativeView();
+		this._tapHandler = TapHandlerImpl.initWithOwner(new WeakRef(this));
+		this.nativeViewProtected.addTargetActionForControlEvents(this._tapHandler, 'tap', UIControlEvents.TouchUpInside);
+	}
+
+	public disposeNativeView(): void {
+		this._tapHandler = null;
+		super.disposeNativeView();
 	}
 
 	[colorSchemeProperty.setNative](value: ColorSchemeType) {
@@ -307,12 +316,62 @@ export class GoogleSignInButton extends GoogleSignInButtonBase {
 		}
 	}
 
-	public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number) {
-		const nativeView = this.nativeView;
+	public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number): void {
+		const layout = Utils.layout;
+
+		const nativeView = this.nativeViewProtected;
+
 		if (nativeView) {
-			const width = Utils.layout.getMeasureSpecSize(widthMeasureSpec);
-			const height = Utils.layout.getMeasureSpecSize(heightMeasureSpec);
-			this.setMeasuredDimension(width, height);
+			const width = layout.getMeasureSpecSize(widthMeasureSpec);
+			const widthMode = layout.getMeasureSpecMode(widthMeasureSpec);
+			const height = layout.getMeasureSpecSize(heightMeasureSpec);
+			const heightMode = layout.getMeasureSpecMode(heightMeasureSpec);
+
+			const horizontalPadding = this.effectivePaddingLeft + this.effectiveBorderLeftWidth + this.effectivePaddingRight + this.effectiveBorderRightWidth;
+			let verticalPadding = this.effectivePaddingTop + this.effectiveBorderTopWidth + this.effectivePaddingBottom + this.effectiveBorderBottomWidth;
+
+			// The default button padding for UIButton - 6dip top and bottom.
+			if (verticalPadding === 0) {
+				verticalPadding = layout.toDevicePixels(12);
+			}
+
+			const desiredSize = layout.measureNativeView(nativeView, width - horizontalPadding, widthMode, height - verticalPadding, heightMode);
+
+			desiredSize.width = desiredSize.width + horizontalPadding;
+			desiredSize.height = desiredSize.height + verticalPadding;
+
+			const measureWidth = Math.max(desiredSize.width, this.effectiveMinWidth);
+			const measureHeight = Math.max(desiredSize.height, this.effectiveMinHeight);
+
+			const widthAndState = View.resolveSizeAndState(measureWidth, width, widthMode, 0);
+			const heightAndState = View.resolveSizeAndState(measureHeight, height, heightMode, 0);
+
+			this.setMeasuredDimension(widthAndState, heightAndState);
 		}
 	}
 }
+
+@NativeClass
+class TapHandlerImpl extends NSObject {
+	private _owner: WeakRef<GoogleSignInButton>;
+
+	public static initWithOwner(owner: WeakRef<GoogleSignInButton>): TapHandlerImpl {
+		const handler = <TapHandlerImpl>TapHandlerImpl.new();
+		handler._owner = owner;
+		return handler;
+	}
+
+	public tap(args) {
+		// _owner is a {N} view which could get destroyed when a tap initiates (protect!)
+		if (this._owner) {
+			const owner = this._owner?.deref();
+			if (owner) {
+				owner._emit(GoogleSignInButton.tapEvent);
+			}
+		}
+	}
+
+	public static ObjCExposedMethods = {
+		tap: { returns: interop.types.void, params: [interop.types.id] },
+	};
+}