design: Use bottom navigation

Straight to the evil side...
This commit is contained in:
Peter Cai 2022-08-27 15:45:04 -04:00
parent 705785630e
commit ceda2ef715
10 changed files with 109 additions and 21 deletions

View File

@ -1,27 +1,53 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="DesignSurface">
<option name="filePathToZoomLevelMap">
<map>
<entry key="app/src/main/res/drawable/bottom_navigation_color_selector.xml" value="0.287" />
<entry key="app/src/main/res/drawable/circle_accent.xml" value="0.288" />
<entry key="app/src/main/res/layout/activity_main.xml" value="0.2838541666666667" />
<entry key="app/src/main/res/layout/activity_settings.xml" value="0.19375" />
<entry key="app/src/main/res/menu/bottom_navigation.xml" value="0.2828125" />
<entry key="app/src/main/res/menu/main_activity_menu.xml" value="0.2838541666666667" />
</map>
</option>
</component>
<component name="ExternalStorageConfigurationManager" enabled="true" />
<component name="NullableNotNullManager">
<option name="myDefaultNullable" value="android.support.annotation.Nullable" />
<option name="myDefaultNotNull" value="android.support.annotation.NonNull" />
<option name="myNullables">
<value>
<list size="5">
<list size="12">
<item index="0" class="java.lang.String" itemvalue="org.jetbrains.annotations.Nullable" />
<item index="1" class="java.lang.String" itemvalue="javax.annotation.Nullable" />
<item index="2" class="java.lang.String" itemvalue="javax.annotation.CheckForNull" />
<item index="3" class="java.lang.String" itemvalue="edu.umd.cs.findbugs.annotations.Nullable" />
<item index="4" class="java.lang.String" itemvalue="android.support.annotation.Nullable" />
<item index="5" class="java.lang.String" itemvalue="org.checkerframework.checker.nullness.compatqual.NullableDecl" />
<item index="6" class="java.lang.String" itemvalue="androidx.annotation.Nullable" />
<item index="7" class="java.lang.String" itemvalue="org.eclipse.jdt.annotation.Nullable" />
<item index="8" class="java.lang.String" itemvalue="com.android.annotations.Nullable" />
<item index="9" class="java.lang.String" itemvalue="androidx.annotation.RecentlyNullable" />
<item index="10" class="java.lang.String" itemvalue="org.checkerframework.checker.nullness.qual.Nullable" />
<item index="11" class="java.lang.String" itemvalue="org.checkerframework.checker.nullness.compatqual.NullableType" />
</list>
</value>
</option>
<option name="myNotNulls">
<value>
<list size="4">
<list size="11">
<item index="0" class="java.lang.String" itemvalue="org.jetbrains.annotations.NotNull" />
<item index="1" class="java.lang.String" itemvalue="javax.annotation.Nonnull" />
<item index="2" class="java.lang.String" itemvalue="edu.umd.cs.findbugs.annotations.NonNull" />
<item index="3" class="java.lang.String" itemvalue="android.support.annotation.NonNull" />
<item index="4" class="java.lang.String" itemvalue="androidx.annotation.RecentlyNonNull" />
<item index="5" class="java.lang.String" itemvalue="org.checkerframework.checker.nullness.qual.NonNull" />
<item index="6" class="java.lang.String" itemvalue="com.android.annotations.NonNull" />
<item index="7" class="java.lang.String" itemvalue="androidx.annotation.NonNull" />
<item index="8" class="java.lang.String" itemvalue="org.checkerframework.checker.nullness.compatqual.NonNullType" />
<item index="9" class="java.lang.String" itemvalue="org.checkerframework.checker.nullness.compatqual.NonNullDecl" />
<item index="10" class="java.lang.String" itemvalue="org.eclipse.jdt.annotation.NonNull" />
</list>
</value>
</option>

View File

@ -18,7 +18,6 @@ import androidx.activity.result.ActivityResult;
import androidx.activity.result.ActivityResultLauncher;
import androidx.activity.result.contract.ActivityResultContracts;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.SearchView;
@ -27,8 +26,7 @@ import androidx.localbroadcastmanager.content.LocalBroadcastManager;
import androidx.viewpager2.adapter.FragmentStateAdapter;
import androidx.viewpager2.widget.ViewPager2;
import com.google.android.material.tabs.TabLayout;
import com.google.android.material.tabs.TabLayoutMediator;
import com.google.android.material.bottomnavigation.BottomNavigationView;
import net.typeblog.shelter.R;
import net.typeblog.shelter.ShelterApplication;
@ -204,7 +202,7 @@ public class MainActivity extends AppCompatActivity {
// Finally we can build the view
// Find all the views
ViewPager2 pager = findViewById(R.id.main_pager);
TabLayout tabs = findViewById(R.id.main_tablayout);
BottomNavigationView nav = findViewById(R.id.main_bottom_navigation);
// Initialize the ViewPager and the tab
// All the remaining work will be done in the fragments
@ -226,12 +224,25 @@ public class MainActivity extends AppCompatActivity {
return 2;
}
});
String[] pageTitles = new String[]{
getString(R.string.fragment_profile_main),
getString(R.string.fragment_profile_work)
};
new TabLayoutMediator(tabs, pager, (tab, position) ->
tab.setText(pageTitles[position])).attach();
pager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
@Override
public void onPageSelected(int position) {
int[] menuIds = new int[]{
R.id.bottom_navigation_main,
R.id.bottom_navigation_work
};
nav.setSelectedItemId(menuIds[position]);
}
});
nav.setOnItemSelectedListener((MenuItem item) -> {
int itemId = item.getItemId();
if (itemId == R.id.bottom_navigation_main) {
pager.setCurrentItem(0);
} else if (itemId == R.id.bottom_navigation_work) {
pager.setCurrentItem(1);
}
return true;
});
}
// Get the service on the other side

View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/colorAccent" android:state_checked="true" />
<item android:color="@color/black" android:state_checked="false" />
</selector>

View File

@ -0,0 +1,5 @@
<vector android:height="24dp" android:tint="#000000"
android:viewportHeight="24" android:viewportWidth="24"
android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="@android:color/white" android:pathData="M10,20v-6h4v6h5v-8h3L12,3 2,12h3v8z"/>
</vector>

View File

@ -0,0 +1,5 @@
<vector android:height="24dp" android:tint="#000000"
android:viewportHeight="24" android:viewportWidth="24"
android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="@android:color/white" android:pathData="M20,6h-4L16,4c0,-1.11 -0.89,-2 -2,-2h-4c-1.11,0 -2,0.89 -2,2v2L4,6c-1.11,0 -1.99,0.89 -1.99,2L2,19c0,1.11 0.89,2 2,2h16c1.11,0 2,-0.89 2,-2L22,8c0,-1.11 -0.89,-2 -2,-2zM14,6h-4L10,4h4v2z"/>
</vector>

View File

@ -10,6 +10,7 @@
android:id="@+id/main_appbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:elevation="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent">
@ -22,13 +23,6 @@
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
<com.google.android.material.tabs.TabLayout
android:id="@+id/main_tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/ToolbarTheme"
app:layout_scrollFlags="scroll|enterAlways" />
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager2.widget.ViewPager2
@ -38,6 +32,20 @@
app:layout_constraintTop_toBottomOf="@id/main_appbar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent" />
app:layout_constraintBottom_toTopOf="@+id/main_bottom_navigation" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@id/main_bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorNavigationBar"
app:menu="@menu/bottom_navigation_menu"
app:itemBackground="@color/colorNavigationBar"
app:itemIconTint="@drawable/bottom_navigation_color_selector"
app:itemTextColor="@drawable/bottom_navigation_color_selector"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="@id/main_pager"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/bottom_navigation_main"
android:icon="@drawable/ic_home"
android:title="@string/fragment_profile_main" />
<item
android:id="@+id/bottom_navigation_work"
android:icon="@drawable/ic_work"
android:title="@string/fragment_profile_work" />
</menu>

View File

@ -0,0 +1,7 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme.Override" parent="AppTheme.Base">
<item name="android:navigationBarColor">@color/colorNavigationBar</item>
<item name="android:windowLightNavigationBar">true</item>
</style>
</resources>

View File

@ -4,6 +4,7 @@
<color name="colorPrimaryDark">#C2C2C2</color>
<color name="colorAccent">#009688</color>
<color name="colorAccentSetupWizard">#FFC107</color>
<color name="colorNavigationBar">#E0F2F1</color>
<color name="black">#333333</color>
<color name="grey">#999999</color>
<color name="disabledAppBackground">#E0F2F1</color>

View File

@ -1,7 +1,7 @@
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimary</item>
@ -10,6 +10,14 @@
<item name="android:windowLightStatusBar">true</item>
</style>
<style name="AppTheme.Override" parent="AppTheme.Base">
<!-- Empty; override from specific styles -->
</style>
<style name="AppTheme" parent="AppTheme.Override">
<!-- Empty; override from specific styles -->
</style>
<!-- Theme for ActionBar -->
<!-- Display the text as accent color -->
<style name="ToolbarTheme" parent="ThemeOverlay.AppCompat.ActionBar">