Wenn du eine Android-App erstellst, brauchst du vielleicht eine "Über uns"-Seite, auf der du einige Informationen über deine App, dein Unternehmen, deine Social-Media-Links, deine Website usw. anzeigen kannst. Eine Möglichkeit ist, eine eigene Aktivität oder ein Fragment zu entwerfen, um diese anzuzeigen. Dies kann über den Editor von Android Studio erfolgen. Eine andere, einfachere Möglichkeit ist die Verwendung einer vordefinierten Seite. Dann können Sie nur diese Optionen anzeigen.
In diesem Artikel werden wir uns Beispiele für diese vordefinierten Seiten ansehen. Hier erfahren Sie, was Sie lernen werden:
- Wie man eine schöne "Über uns"-Seite erstellt.
(a). Wie man eine schöne "Über uns"-Seite in Kotlin und Android erstellt.
Dieses Beispiel zeigt, wie man eine "Über uns"-Seite mit Hilfe der "Fancy About Us"-Seitenbibliothek erstellt. Wir verwenden die folgenden Technologien:
- Programmiersprache: Java
- IDE: Android Studio
Hier ist ein Video-Tutorial:
Hier sind die Schritte, die Sie befolgen;
Schritt 1: Add Dependency
Sie müssen die schicke Über uns Seitenbibliothek in Ihre App-Level build.gradle Datei hinzufügen:
implementation 'com.github.Shashank02051997:FancyAboutPage-Android:2.6'
Dann synchronisieren Sie Ihr Projekt.
Schritt 2: Kotlin Code
Dann werden wir eine Aktivität haben, unsere Hauptaktivität:
MainActivity.kt
Beginnen Sie damit, Ihre Importe hinzuzufügen:
import android.graphics.Color;
import android.os.Build;
import android.support.annotation.RequiresApi;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
Dann erstellen Sie die Klasse, indem Sie die appcompatactivity erweitern. Überschreiben Sie auch die onCreate-Methode
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
Nun referenzieren Sie einfach die FancyAboutUsPage und setzen ihre Eigenschaften:
val fancyAboutPage = findViewById<FancyAboutPage>(R.id.fancyaboutpage)
//fancyAboutPage.setCoverTintColor(Color.BLUE); //Optional
fancyAboutPage.setCover(R.drawable.coverimg)
fancyAboutPage.setName("Shashank Singhal")
fancyAboutPage.setDescription("Google Certified Associate Android Developer | Android App, Game, Web and Software Developer.")
fancyAboutPage.setAppIcon(R.drawable.cakepop)
fancyAboutPage.setAppName("Cake Pop Icon Pack")
fancyAboutPage.setVersionNameAsAppSubTitle("1.2.3")
fancyAboutPage.setAppDescription(
"""
Cake Pop Icon Pack is an icon pack which follows Google's Material Design language.
This icon pack uses the material design color palette given by google. Every icon is handcrafted with attention to the smallest details!
A fresh new take on Material Design iconography. Cake Pop offers unique, creative and vibrant icons. Spice up your phones home-screen by giving it a fresh and unique look with Polycon.
""".trimIndent()
)
fancyAboutPage.addEmailLink("shashanksinghal02@gmail.com")
fancyAboutPage.addFacebookLink("https://www.facebook.com/shashanksinghal02")
fancyAboutPage.addTwitterLink("https://twitter.com/shashank020597")
fancyAboutPage.addLinkedinLink("https://www.linkedin.com/in/shashank-singhal-a87729b5/")
fancyAboutPage.addGitHubLink("https://github.com/Shashank02051997")
Hier ist der vollständige Code:
package info.camposha.ms_fancy_aboutpage
import android.os.Bundle
import android.view.View
import androidx.appcompat.app.AppCompatActivity
import com.shashank.sony.fancyaboutpagelib.FancyAboutPage
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
title = "About Page"
supportActionBar!!.setDisplayHomeAsUpEnabled(true)
window.decorView.systemUiVisibility = (
View.SYSTEM_UI_FLAG_LAYOUT_STABLE
or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN)
val fancyAboutPage = findViewById<FancyAboutPage>(R.id.fancyaboutpage)
//fancyAboutPage.setCoverTintColor(Color.BLUE); //Optional
fancyAboutPage.setCover(R.drawable.coverimg)
fancyAboutPage.setName("Shashank Singhal")
fancyAboutPage.setDescription("Google Certified Associate Android Developer | Android App, Game, Web and Software Developer.")
fancyAboutPage.setAppIcon(R.drawable.cakepop)
fancyAboutPage.setAppName("Cake Pop Icon Pack")
fancyAboutPage.setVersionNameAsAppSubTitle("1.2.3")
fancyAboutPage.setAppDescription(
"""
Cake Pop Icon Pack is an icon pack which follows Google's Material Design language.
This icon pack uses the material design color palette given by google. Every icon is handcrafted with attention to the smallest details!
A fresh new take on Material Design iconography. Cake Pop offers unique, creative and vibrant icons. Spice up your phones home-screen by giving it a fresh and unique look with Polycon.
""".trimIndent()
)
fancyAboutPage.addEmailLink("shashanksinghal02@gmail.com")
fancyAboutPage.addFacebookLink("https://www.facebook.com/shashanksinghal02")
fancyAboutPage.addTwitterLink("https://twitter.com/shashank020597")
fancyAboutPage.addLinkedinLink("https://www.linkedin.com/in/shashank-singhal-a87729b5/")
fancyAboutPage.addGitHubLink("https://github.com/Shashank02051997")
}
}
Schritt 3: Layouts
Fügen Sie den folgenden Code in Ihr Hauptlayout ein:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF">
<com.shashank.sony.fancyaboutpagelib.FancyAboutPage
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/fancyaboutpage"
>
<com.mikhaellopez.circularimageview.CircularImageView
android:layout_width="140dp"
android:layout_height="140dp"
android:layout_marginTop="180dp"
android:layout_alignParentRight="true"
android:layout_marginRight="10dp"
android:src="@drawable/shashankprofileimg"
app:civ_border_color="#40FFFFFF"
app:civ_border_width="10dp"
android:id="@+id/circularImageView" />
</com.shashank.sony.fancyaboutpagelib.FancyAboutPage>
</RelativeLayout>
</ScrollView>
</RelativeLayout>
Schritt 4: Ausführen
Führen Sie das Projekt aus und Sie erhalten das folgende Ergebnis:
Schritt 5: Herunterladen
Laden Sie den Code hier herunter.