Schauen Sie sich dieses Projekt auf dribbble an.
Schauen Sie sich dieses Projekt auf Behance an.
Gott segne die Ukraine!
Hängt von Ozodrukhs Animations-Util für die CircularReveal-Animation für Version 2.3+ ab
Zunächst müssen Sie das Animationssubmodul mit dem Befehl git submodule update --init
hochladen
Oder Sie können eine Gradle-Abhängigkeit mit dem folgenden Befehl hinzufügen:
dependencies {
implementation ' com.github.yalantis:Side-Menu.Android:1.0.2 '
}
.
und Befehl:
repositories {
maven {
url " https://jitpack.io "
}
}
dependencies {
implementation ' com.github.ozodrukh:CircularReveal:(latest-release)@aar '
}
Um eine Gradle-Abhängigkeit hinzuzufügen, müssen Sie build.gradle öffnen (in Ihrem App-Ordner, nicht in einem Projektordner) und dann die Abhängigkeiten kopieren und dort im Abhängigkeitsblock hinzufügen.
für das CircularReveal-Modul
Anschließend müssen Sie ein spezielles Overlay-Layout erstellen, das hinter der aktuellen animierten Ansicht Circular Reveal
angezeigt wird. Und um alle Elemente zum Menü hinzuzufügen, müssen Sie sie alle in LinearLayout
hinzufügen
< android .support.v4.widget.DrawerLayout
xmlns : android = " http://schemas.android.com/apk/res/android "
android : id = " @+id/drawer_layout "
android : layout_width = " match_parent "
android : layout_height = " match_parent " >
< io .codetail.widget.RevealFrameLayout
android : id = " @+id/conteiner_frame "
xmlns : android = " http://schemas.android.com/apk/res/android "
android : layout_width = " match_parent "
android : layout_height = " match_parent " >
< LinearLayout
android : id = " @+id/content_overlay "
android : layout_width = " match_parent "
android : layout_height = " match_parent "
android : orientation = " vertical " />
< LinearLayout
android : id = " @+id/content_frame "
android : layout_width = " match_parent "
android : layout_height = " match_parent "
android : orientation = " vertical " />
< android .support.v7.widget.Toolbar
android : id = " @+id/toolbar "
android : layout_height = " wrap_content "
android : layout_width = " match_parent "
android : minHeight = " ?attr/actionBarSize "
android : background = " ?attr/colorPrimary " />
</ io .codetail.widget.RevealFrameLayout>
< ScrollView
android : id = " @+id/scrollView "
android : scrollbarThumbVertical = " @android:color/transparent "
android : layout_width = " 80dp "
android : layout_height = " match_parent "
android : layout_gravity = " start|bottom " >
< LinearLayout
android : id = " @+id/left_drawer "
android : orientation = " vertical "
android : layout_width = " 80dp "
android : layout_height = " wrap_content "
android : divider = " @android:color/transparent "
android : dividerHeight = " 0dp "
android : background = " @android:color/transparent " >
<!-- Layout of Drawer -->
</ LinearLayout >
</ ScrollView >
</ android .support.v4.widget.DrawerLayout>
ViewAnimator viewAnimator = new ViewAnimator <>( ActionBarActivity . this ,
new ArrayList < Resourceble >(),
( LinearLayout ) findViewById ( R . id . left_drawer ),
contentFragment , drawerLayout );
//to open menu you have to override ActionBarDrawerToggle method
@ Override
public void onDrawerSlide ( View drawerView , float slideOffset ) {
super . onDrawerSlide ( drawerView , slideOffset );
if ( slideOffset > 0.6 && viewAnimator . getLinearLayout (). getChildCount () == 0 )
viewAnimator . showMenuContent ();
}
public void onDrawerClosed ( View view ) {
super . onDrawerClosed ( view );
viewAnimator . getLinearLayout (). removeAllViews ();
viewAnimator . getLinearLayout (). invalidate ();
}
Alle Menüelemente sollten Resourceble
Schnittstelle implementieren, um den Namen des Menüelements und die zeichnbare Auflösung zu erhalten. Und alle Fragmente sollten ScreenShotable
implementieren, um einen Screenshot eines Fragments zu erhalten
Sie können die Symbole, die Sie im Menü platzieren, anpassen oder weitere Elemente hinzufügen. Ändern Sie einfach die Liste, die Sie analysieren, um den Animator anzuzeigen. Zum Beispiel:
private List < SlideMenuItem > list = new ArrayList <>(); \ the list of menu items
SlideMenuItem menuItem0 = new SlideMenuItem ( ContentFragment . CLOSE , R . drawable . icn_close );
list . add ( menuItem0 );
SlideMenuItem menuItem = new SlideMenuItem ( ContentFragment . BUILDING , R . drawable . icn_1 ); f irst parameter is the id of menu item , the second is the icon resouce
list . add ( menuItem );
SlideMenuItem menuItem2 = new SlideMenuItem ( ContentFragment . BOOK , R . drawable . icn_2 );
list . add ( menuItem2 );
viewAnimator = new ViewAnimator <>( this , list , contentFragment , drawerLayout , this );
Wir würden uns sehr freuen, wenn Sie uns Links zu Ihren Projekten senden, in denen Sie unsere Komponente einsetzen. Senden Sie einfach eine E-Mail an [email protected]. Teilen Sie uns mit, wenn Sie Fragen oder Vorschläge zur Animation haben.
PS: Wir werden noch mehr Großartiges in Code und ein Tutorial veröffentlichen, wie man die Benutzeroberfläche für Android (iOS) besser als besser macht. Bleiben Sie dran!
Copyright 2019, Yalantis
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.