Skip to content

Commit

Permalink
[VisionGlass] New design of the PhoneUI
Browse files Browse the repository at this point in the history 
This PR moves all the style bits of the visionglass_layout.xml into
the themes.xml resource file. This way we can define a more structured
and flexible design.

Additionally, this change provides a new design of the PhoneUI to
provide a more android-friendly UI, with rounded-corner elements and
an homogeneous color pattern.
  • Loading branch information
@javifernandez
javifernandez committed Feb 20, 2025
1 parent cb4679f commit d0a6eac
Show file tree
Hide file tree
Showing 6 changed files with 186 additions and 180 deletions.
39 changes: 7 additions & 32 deletions app/src/visionglass/java/com/igalia/wolvic/PlatformActivity.java
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,6 @@
import android.view.WindowManager;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.PopupWindow;
import android.widget.SeekBar;

import androidx.annotation.Keep;
Expand All @@ -47,6 +46,7 @@
import androidx.lifecycle.ProcessLifecycleOwner;
import androidx.lifecycle.ViewModelProvider;

import com.google.android.material.slider.Slider;
import com.huawei.hms.mlsdk.common.MLApplication;
import com.huawei.usblib.DisplayMode;
import com.huawei.usblib.DisplayModeCallback;
Expand Down Expand Up @@ -87,7 +87,6 @@ public class PlatformActivity extends FragmentActivity implements SensorEventLis
private boolean mSwitchedTo3DMode = false;
private AlignPhoneDialogFragment mAlignDialogFragment;
private AlignNotificationUIDialog mAlignNotificationUIDialog;
private PopupWindow mWindowDistancePopupWindow;

@SuppressWarnings("unused")
public static boolean filterPermission(final String aPermission) {
Expand Down Expand Up @@ -515,9 +514,6 @@ private void notifyPendingEvents() {
}

private void updateDisplays() {
if (mWindowDistancePopupWindow.isShowing())
mWindowDistancePopupWindow.dismiss();

// a display may be added before we receive the USB permission
if (!VisionGlass.getInstance().hasUsbPermission()) {
Log.d(LOGTAG, "updateDisplays: no USB permissions yet");
Expand Down Expand Up @@ -638,37 +634,16 @@ private void setupPhoneUI() {
mDelegate.setLockMode(mBinding.headlockToggleButton.isChecked() ? WidgetManagerDelegate.HEAD_LOCK : WidgetManagerDelegate.NO_LOCK);
});

ContextThemeWrapper themedContext = new ContextThemeWrapper(PlatformActivity.this, R.style.Theme_WolvicPhone);
LayoutInflater inflater = getLayoutInflater().cloneInContext(themedContext);
View popupView = inflater.inflate(R.layout.window_distance_popup_layout, null);

final int width = LinearLayout.LayoutParams.WRAP_CONTENT;
final int height = LinearLayout.LayoutParams.WRAP_CONTENT;
final boolean focusable = true; // Let taps outside the popup also dismiss it
mWindowDistancePopupWindow = new PopupWindow(popupView, width, height, focusable);

SeekBar seekBar = popupView.findViewById(R.id.windowDistancePopupSeekBar);
seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
settings.setWindowDistance((float) progress / seekBar.getMax());
}

Slider distanceSlider = findViewById(R.id.distance_slider);
float maxValue = distanceSlider.getValueTo();
distanceSlider.setValue(settings.getWindowDistance() * maxValue);
distanceSlider.addOnChangeListener(new Slider.OnChangeListener() {
@Override
public void onStartTrackingTouch(SeekBar seekBar) {}

@Override
public void onStopTrackingTouch(SeekBar seekBar) {
// Automatically hide the popup after the user has selected a value.
mWindowDistancePopupWindow.dismiss();
public void onValueChange(@NonNull Slider slider, float value, boolean fromUser) {
settings.setWindowDistance((float) value / maxValue);
}
});

mBinding.windowDistanceButton.setOnClickListener(v -> {
seekBar.setProgress((int) (settings.getWindowDistance() * seekBar.getMax()));
mWindowDistancePopupWindow.showAsDropDown(v, 0, 0);
});

mBinding.playButton.setOnClickListener(v -> {
Media media = getActiveMedia();
if (media == null)
Expand Down
11 changes: 2 additions & 9 deletions app/src/visionglass/res/drawable/touchpad_ripple_bg.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,6 @@
android:color="@color/azure">
<item
android:id="@android:id/mask"
android:drawable="@android:color/white" />
<item>
<selector>
<item
android:drawable="@color/silver"
android:state_pressed="true" />
<item android:drawable="@color/silver" />
</selector>
</item>
android:drawable="@drawable/touchpad_rounded_bg" />
<item android:drawable="@drawable/touchpad_rounded_bg" />
</ripple>
6 changes: 6 additions & 0 deletions app/src/visionglass/res/drawable/touchpad_rounded_bg.xml
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/photonGrey50" />
<corners android:radius="32dp" />
</shape>
154 changes: 40 additions & 114 deletions app/src/visionglass/res/layout/visionglass_layout.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,16 +18,8 @@

<com.google.android.material.appbar.MaterialToolbar
android:id="@+id/toolbar"
style="@style/Widget.MaterialComponents.Toolbar.Primary"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:elevation="0dp"
android:paddingStart="8dp"
android:paddingEnd="8dp"
app:logoAdjustViewBounds="true"
app:navigationIcon="@drawable/ff_logo_icon_48"
app:popupTheme="@style/Theme.WolvicPhone.PopupOverlay"
app:title="@string/app_name" />
app:title="@string/app_name"
style="@style/ToolbarStyle" />

<TextView
style="@style/TextAppearance.AppCompat.Headline"
Expand Down Expand Up @@ -68,62 +60,43 @@

<com.google.android.material.button.MaterialButton
android:id="@+id/headlock_toggle_button"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:backgroundTint="@color/bg_button_checkable"
android:checkable="true"
android:checked="false"
android:contentDescription="@string/display_options_head_lock"
android:scaleType="fitCenter"
app:icon="@drawable/headlock_toggle_button_states"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white"
app:layout_constraintEnd_toStartOf="@id/realign_button"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
app:layout_constraintEnd_toStartOf="@id/realign_button"
app:layout_constraintTop_toTopOf="parent"
style="@style/HeadlockToggleButtonStyle" />

<com.igalia.wolvic.AlignDynamicButton
android:id="@+id/realign_button"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:backgroundTint="@color/azure"
app:iconTint="@color/white"
app:layout_constraintEnd_toStartOf="@id/voice_search_button"
app:layout_constraintStart_toEndOf="@id/headlock_toggle_button"
app:layout_constraintTop_toTopOf="parent" />
app:layout_constraintEnd_toStartOf="@id/voice_search_button"
app:layout_constraintTop_toTopOf="parent"
style="@style/RealignButtonStyle" />

<com.google.android.material.button.MaterialButton
android:id="@+id/voice_search_button"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:backgroundTint="@color/azure"
android:checkable="true"
android:checked="false"
android:contentDescription="@string/voice_search_tooltip"
android:scaleType="fitCenter"
app:icon="@drawable/ic_icon_microphone"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white"
app:layout_constraintEnd_toStartOf="@id/window_distance_button"
app:layout_constraintStart_toEndOf="@id/realign_button"
app:layout_constraintTop_toTopOf="parent" />
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
style="@style/VoiceSearchButtonStyle" />

<com.google.android.material.button.MaterialButton
android:id="@+id/window_distance_button"
<androidx.constraintlayout.widget.Barrier
android:id="@+id/barrier"
android:layout_width="wrap_content"
android:layout_height="?attr/actionBarSize"
android:backgroundTint="@color/azure"
android:contentDescription="@string/display_options_windows_distance"
android:scaleType="fitCenter"
app:icon="@drawable/unfold_more_24px"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white"
android:layout_height="wrap_content"
app:barrierDirection="bottom"
app:constraint_referenced_ids="headlock_toggle_button,realign_button,voice_search_button" />

<com.google.android.material.slider.Slider
android:id="@+id/distance_slider"
style="@style/DistanceSliderStyle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/voice_search_button"
app:layout_constraintTop_toTopOf="parent" />
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/barrier" />

<FrameLayout
android:id="@+id/touchpad_container"
Expand All @@ -134,22 +107,16 @@
app:layout_constraintBottom_toTopOf="@id/media_controls"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/headlock_toggle_button">
app:layout_constraintTop_toBottomOf="@id/distance_slider">

<View
android:id="@+id/touchpad"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/touchpad_ripple_bg"
android:clickable="true"
android:focusable="true"/>
style="@style/TouchpadStyle" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:clickable="false"
android:focusable="false"
android:text="@string/vision_glass_touchpad_instructions"/>
style="@style/TouchpadInstructionsStyle" />
</FrameLayout>

<LinearLayout
android:id="@+id/media_controls"
android:layout_width="match_parent"
Expand All @@ -165,8 +132,7 @@

<SeekBar
android:id="@+id/media_seekbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
style="@style/MediaSeekBarStyle" />

<LinearLayout
android:layout_width="match_parent"
Expand All @@ -175,36 +141,15 @@

<com.google.android.material.button.MaterialButton
android:id="@+id/seek_backward_button"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
app:icon="@drawable/ic_icon_media_seek_backward"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white" />
style="@style/SeekBackwardButtonStyle" />

<com.google.android.material.button.MaterialButton
android:id="@+id/play_button"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
app:icon="@android:drawable/ic_media_play"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white" />
style="@style/PlayButtonStyle" />

<com.google.android.material.button.MaterialButton
android:id="@+id/seek_forward_button"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
app:icon="@drawable/ic_icon_media_seek_forward"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white" />
style="@style/SeekForwardButtonStyle" />

<Space
android:layout_width="16dp"
Expand All @@ -213,13 +158,7 @@

<com.google.android.material.button.MaterialButton
android:id="@+id/mute_button"
style="@style/Widget.AppCompat.Button.Borderless"
android:layout_width="64dp"
android:layout_height="match_parent"
app:icon="@drawable/ic_icon_media_volume"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white" />
style="@style/MuteButtonStyle" />
</LinearLayout>

</LinearLayout>
Expand All @@ -237,34 +176,21 @@

<com.google.android.material.button.MaterialButton
android:id="@+id/back_button"
android:layout_width="0dp"
android:layout_height="64dp"
android:layout_weight="3"
android:backgroundTint="@color/azure"
android:contentDescription="@string/back_tooltip"
android:scaleType="fitCenter"
app:icon="@drawable/ic_icon_back"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white" />
android:layout_weight="3"
style="@style/BackButtonButtonStyle" />

<Space
android:layout_width="16dp"
android:layout_height="0dp" />

<com.google.android.material.button.MaterialButton
android:id="@+id/home_button"
android:layout_width="64dp"
android:layout_height="64dp"
android:backgroundTint="@color/azure"
android:contentDescription="@string/home_tooltip"
android:scaleType="fitCenter"
app:icon="@drawable/ic_icon_home"
app:iconGravity="textStart"
app:iconPadding="0dp"
app:iconTint="@color/white" />
style="@style/HomeButtonStyle" />

</LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>
</LinearLayout>
</layout>
25 changes: 0 additions & 25 deletions app/src/visionglass/res/layout/window_distance_popup_layout.xml
View file

This file was deleted.

Loading

0 comments on commit d0a6eac

Please sign in to comment.