Better squircles

grishka · Feb 24, 2021 · 391b855 · 391b855
1 parent c336163
commit 391b855
Show file tree

Hide file tree

Showing 9 changed files with 61 additions and 34 deletions.
diff --git a/Houseclub/build.gradle b/Houseclub/build.gradle
@@ -7,8 +7,8 @@ android {
 		applicationId "me.grishka.houseclub"
 		minSdkVersion 24
 		targetSdkVersion 30
-		versionCode 8
-		versionName "1.0.7"
+		versionCode 9
+		versionName "1.0.8"
 	}
 	buildTypes {
 		release {

diff --git a/Houseclub/src/main/java/me/grishka/houseclub/fragments/HomeFragment.java b/Houseclub/src/main/java/me/grishka/houseclub/fragments/HomeFragment.java
@@ -182,7 +182,7 @@ private class ChannelViewHolder extends BindableViewHolder<Channel> implements V
 
 		private TextView topic, speakers, numMembers, numSpeakers;
 		private ImageView pic1, pic2;
-		private Drawable placeholder=new ColorDrawable(0xFF808080);
+		private Drawable placeholder=new ColorDrawable(getResources().getColor(R.color.grey));
 
 		public ChannelViewHolder(){
 			super(getActivity(), R.layout.channel_row);

diff --git a/Houseclub/src/main/java/me/grishka/houseclub/fragments/InChannelFragment.java b/Houseclub/src/main/java/me/grishka/houseclub/fragments/InChannelFragment.java
@@ -356,7 +356,7 @@ private class UserViewHolder extends BindableViewHolder<ChannelUser> implements
 		private ImageView photo, muted;
 		private TextView name;
 		private View speakerBorder;
-		private Drawable placeholder=new ColorDrawable(0xFF808080);
+		private Drawable placeholder=new ColorDrawable(getResources().getColor(R.color.grey));
 
 		public UserViewHolder(boolean large){
 			super(getActivity(), R.layout.channel_user_cell, list);

diff --git a/Houseclub/src/main/java/me/grishka/houseclub/fragments/NotificationListFragment.java b/Houseclub/src/main/java/me/grishka/houseclub/fragments/NotificationListFragment.java
@@ -114,7 +114,7 @@ private class NotificationViewHolder extends BindableViewHolder<Notification> im
 		public TextView name, message, time;
 		public Button followBtn;
 		public ImageView photo;
-		private Drawable placeholder=new ColorDrawable(0xFF808080);
+		private Drawable placeholder=new ColorDrawable(getResources().getColor(R.color.grey));
 
 		public NotificationViewHolder(){
 			super(getActivity(), R.layout.notification_list_row);

diff --git a/Houseclub/src/main/java/me/grishka/houseclub/fragments/ProfileFragment.java b/Houseclub/src/main/java/me/grishka/houseclub/fragments/ProfileFragment.java
@@ -109,7 +109,7 @@ public void onSuccess(GetProfile.Response result){
 
 						name.setText(user.name);
 						username.setText('@'+user.username);
-						ColorDrawable d=new ColorDrawable(0xFF808080);
+						ColorDrawable d=new ColorDrawable(getResources().getColor(R.color.grey));
 						if(user.photoUrl!=null)
 							ViewImageLoader.load(photo, d, user.photoUrl);
 						else
@@ -141,7 +141,7 @@ public void onSuccess(GetProfile.Response result){
 
 						String joined=getString(R.string.joined_date, DateFormat.getDateInstance().format(user.timeCreated));
 						if(user.invitedByUserProfile!=null){
-							ColorDrawable d2=new ColorDrawable(0xFF808080);
+							ColorDrawable d2=new ColorDrawable(getResources().getColor(R.color.grey));
 							joined+="\n"+getString(R.string.invited_by, user.invitedByUserProfile.name);
 							if(user.invitedByUserProfile.photoUrl!=null)
 								ViewImageLoader.load(inviterPhoto, d2, user.invitedByUserProfile.photoUrl);

diff --git a/Houseclub/src/main/java/me/grishka/houseclub/fragments/UserListFragment.java b/Houseclub/src/main/java/me/grishka/houseclub/fragments/UserListFragment.java
@@ -94,7 +94,7 @@ private class UserViewHolder extends BindableViewHolder<FullUser> implements Ima
 		public TextView name, bio;
 		public Button followBtn;
 		public ImageView photo;
-		private Drawable placeholder=new ColorDrawable(0xFF808080);
+		private Drawable placeholder=new ColorDrawable(getResources().getColor(R.color.grey));
 
 		public UserViewHolder(){
 			super(getActivity(), R.layout.user_list_row);

diff --git a/Houseclub/src/main/java/me/grishka/houseclub/views/SquircleImageView.java b/Houseclub/src/main/java/me/grishka/houseclub/views/SquircleImageView.java
@@ -2,36 +2,21 @@
 
 import android.content.Context;
 import android.graphics.Canvas;
-import android.graphics.Outline;
+import android.graphics.Matrix;
 import android.graphics.Paint;
 import android.graphics.Path;
+import android.graphics.PorterDuff;
+import android.graphics.PorterDuffXfermode;
 import android.util.AttributeSet;
-import android.util.Log;
-import android.view.View;
-import android.view.ViewOutlineProvider;
 import android.widget.ImageView;
 
 import androidx.annotation.Nullable;
 import me.grishka.appkit.utils.V;
 
 public class SquircleImageView extends ImageView{
 
-	private static final ViewOutlineProvider squircleOutline=new ViewOutlineProvider(){
-		@Override
-		public void getOutline(View view, Outline outline){
-			if(view.getWidth()==0 || view.getHeight()==0)
-				return;
-//			Path path=new Path();
-//			path.moveTo(0, view.getHeight()/2f);
-//			path.cubicTo(0f, 0f, 0f, 0f, view.getWidth()/2f, 0f);
-//			path.cubicTo(view.getWidth(), 0f, view.getWidth(), 0f, view.getWidth(), view.getHeight()/2f);
-//			path.cubicTo(view.getWidth(), view.getHeight(), view.getWidth(), view.getHeight(), view.getWidth()/2f, view.getHeight());
-//			path.cubicTo(0f, view.getHeight(), 0f, view.getHeight(), 0f, view.getHeight()/2f);
-//			path.close();
-//			outline.setConvexPath(path);
-			outline.setRoundRect(0, 0, view.getWidth(), view.getHeight(), view.getWidth()*0.42f);
-		}
-	};
+	private Path clipPath, borderPath=new Path();
+	private Paint clipPaint, borderPaint;
 
 	public SquircleImageView(Context context){
 		super(context);
@@ -49,8 +34,44 @@ public SquircleImageView(Context context, @Nullable AttributeSet attrs, int defS
 	}
 
 	private void init(){
+		// Why not clipToOutline? Because clipping isn't supported for arbitrary paths ¯\_(ツ)_/¯
 		setScaleType(ScaleType.CENTER_CROP);
-		setOutlineProvider(squircleOutline);
-		setClipToOutline(true);
+		setLayerType(LAYER_TYPE_HARDWARE, null); // important so that CLEAR xfermode doesn't put a hole through the entire window
+		clipPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
+		clipPaint.setColor(0xFF000000);
+		clipPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
+		borderPaint=new Paint(Paint.ANTI_ALIAS_FLAG);
+		borderPaint.setColor(0x20000000);
+	}
+
+	@Override
+	protected void onSizeChanged(int w, int h, int oldw, int oldh){
+		super.onSizeChanged(w, h, oldw, oldh);
+		clipPath=new Path();
+		clipPath.moveTo(0.0f, 100.0f);
+		clipPath.cubicTo(0.0f, 33.0f, 33.0f, 0.0f, 100.0f, 0.0f);
+		clipPath.cubicTo(167.0f, 0.0f, 200.0f, 33.0f, 200.0f, 100.0f);
+		clipPath.cubicTo(200.0f, 167.0f, 167.0f, 200.0f, 100.0f, 200.0f);
+		clipPath.cubicTo(33.0f, 200.0f, 0.0f, 167.0f, 0.0f, 100.0f);
+		clipPath.close();
+
+		Matrix m=new Matrix();
+		m.setScale(w/200f, h/200f, 0f, 0f);
+		clipPath.transform(m);
+
+		m.setScale((float)(w-V.dp(1))/w, (float)(w-V.dp(1))/h, w/2f, h/2f);
+		clipPath.transform(m, borderPath);
+
+		clipPath.toggleInverseFillType();
+		borderPath.toggleInverseFillType();
+	}
+
+	@Override
+	protected void dispatchDraw(Canvas canvas){
+		super.dispatchDraw(canvas);
+		if(clipPath!=null){
+			canvas.drawPath(borderPath, borderPaint);
+			canvas.drawPath(clipPath, clipPaint);
+		}
 	}
 }
diff --git a/Houseclub/src/main/res/drawable/speaker_border.xml b/Houseclub/src/main/res/drawable/speaker_border.xml
@@ -1,5 +1,11 @@
 <?xml version="1.0" encoding="utf-8"?>
-<shape xmlns:android="http://schemas.android.com/apk/res/android">
-	<corners android:radius="37dp"/>
-	<stroke android:color="@color/grey" android:width="4dp"/>
-</shape>
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+	android:width="88dp"
+	android:height="88dp"
+	android:viewportWidth="88"
+	android:viewportHeight="88">
+	<group android:translateX="2" android:translateY="2">
+		<path android:pathData="M0,42C0,13.8599997,13.8599997,0,42,0s42,13.8599997,42,42S70.1399994,84,42,84S0,70.1399994,0,42"
+			android:strokeColor="@color/grey" android:strokeWidth="4"/>
+	</group>
+</vector>
diff --git a/Houseclub/src/main/res/values/colors..xml → Houseclub/src/main/res/values/colors.xml b/Houseclub/src/main/res/values/colors..xml → Houseclub/src/main/res/values/colors.xml