Lorsque vous créez une application Android, vous pouvez avoir besoin d'une page d'accueil pour afficher des informations sur votre application, votre entreprise, vos liens vers les médias sociaux, votre site Web, etc. Une façon de procéder est de concevoir votre propre activité ou fragment pour afficher ces informations. Cela peut être fait via l'éditeur d'android studio. Une autre option plus facile est d'utiliser une page prédéfinie. Ensuite, vous pouvez juste ces options.

Dans cet article, nous allons examiner des exemples de ces pages prédéfinies à propos de nous. Voici ce que vous allez apprendre :

  1. Comment créer une belle page à propos de nous.

(a). Comment créer une belle page à propos de nous en Kotlin android.

Cet exemple explore comment créer une page à propos de nous en utilisant la bibliothèque fancy about us page. Nous utilisons les technologies suivantes :

  1. Langage de programmation : Java
  2. IDE : Android Studio

Voici un tutoriel vidéo :

Voici les étapes à suivre ;

Étape 1 : Ajouter la dépendance

Vous devrez ajouter la bibliothèque fancy about us page dans votre fichier build.gradle de niveau app :

 implementation 'com.github.Shashank02051997:FancyAboutPage-Android:2.6'

Puis synchroniser votre projet.

Étape 2 : Code Kotlin

Ensuite, nous aurons une activité, notre activité principale :

MainActivity.kt

Commencez par ajouter vos importations :

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;

Ensuite, créez la classe en étendant l'appcompatactivity. Surchargez également la méthode onCreate

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

Maintenant, il suffit de référencer la page FancyAboutUsPage et de définir ses propriétés :

 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")

Voici le code complet :

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")
    }
}

Step 3 : Layouts

Ajoutez le code suivant dans votre mise en page principale :

<?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>

Étape 4 : Exécution

Exécutez le projet et vous obtiendrez ce qui suit :

About Us page Example Kotlin

Étape 5 : Télécharger

Téléchargez le code [ici] (https://github.com/Oclemy/MsFancyAboutPage/archive/refs/heads/master.zip).

Catégorisé:

ActivityFrench