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:

  1. 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:

  1. Programmiersprache: Java
  2. IDE: Android Studio

Hier ist ein Video-Tutorial:

Unboxing Tocsen-Sturzsensor

Unboxing Tocsen-Sturzsensor
Unboxing Tocsen-Sturzsensor


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("[email protected]")
        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("[email protected]")
        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:

About Us page Example Kotlin

Schritt 5: Herunterladen

Laden Sie den Code hier herunter.