Skip to content

Latest commit

 

History

History
222 lines (173 loc) · 6.51 KB

02.style-btn-themeSombre-orientation.md

File metadata and controls

222 lines (173 loc) · 6.51 KB

memo

  • sp : pour le texte car s'adapte si par exemple le gsm est en mode malvoyant

  • dp : pour les margins...

  • android:gravity="bottom" : par rapport au contenu ()

  • android:layout_gravity="bottom" : par rapport à son parent

  • android:layout_margin="20dp" : le margin de mon layout ( ma page accueil aurait du margin à d, g, H, bas)

  • layout_weight=1 : la place que prend un élément par rappot aux autres. Tous à 1 prends la même place

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="bottom"
    android:layout_margin="20dp"
    >

Faire un bouton arrondi

  • dans drawable rajouter un "new drawable file"
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" android:padding="10dp">
    <solid android:color="#3F3B3B"/>
    <corners android:radius="40dp"/>
</shape>
  • activity_main.xml
<Button
    android:id="@+id/btnInscription"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="S'inscrire"
    android:background="@drawable/btn_round"
    app:backgroundTint="@color/white" 
    />

Créer un style propre, un thème sombre et jouer sur l'orientation du telephone

Référencez toutes les couleurs dans colors.xml

Pour commencer il faut créer un dossier styles dans le dossier values. Clique droit sur values / new. Donner le nom style au fichier et styles au dossier

On aura 4 fichiers :

  • Un fichier qui regroupe les différentes tailles. On va l'appeler dimension

  • un fichier style général

  • un fichier style pour le mode jour

  • un fichier style pour le mode sombre

  • new ressource files / nom : style qualifiers :

Créer notre fichier pour les dimensions

  • dossier Values, clique droit new Values Ressource File / dim
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <dimen name="tailleTitre">50sp</dimen>
</resources>
  • Utiliser ce tyle dans notre layout

Créer un fichier styleGeneral.xml

Dossier values, clique droit, new value file, styleGeneral Ce fichier represente le style global de l'application. On peut voir que j'utilise ma dimension sur le 2eme item

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="titreDemo">
        <item name="android:textStyle">italic|bold</item>
        <item name="android:textSize">@dimen/tailleTitre</item> 
        <item name="android:paddingStart">20dp</item>
        <item name="android:paddingEnd">10dp</item>
        <item name="android:fontFamily">casual</item>
    </style>
</resources>

Appliquer votre style dans votre layout ( activity_main.xml )

<LinearLayout 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"
    tools:context=".MainActivity"
    android:orientation="Vertical">
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="@string/title_exo1"
                style="@style/titreDemo"
                />
</LinearLayout>

Rajouter des couleurs en prévision de mon thème clair/ sombre dans colors.xml

    <color name="bleu">#2C2C91</color>
    <color name="jaune">#FFF1E159</color>

Faire mon fichier pour le theme clair

clique droit sur value/ new value file / nom : styleClair . Availible qualifers : Night Mode = Not Night

  • name ="nomDuParent.nomAChoisir"
  • parent="titreDemo" le nom du theme parent
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="titreDemo.titre_clair." parent="titreDemo">
        <item name="android:textColor">@color/bleu</item>
    </style>
</resources>

Faire mon fichier pour le thème sombre

clique droit sur value/ new value file / nom : styleSombre . Availible qualifers : Night Mode = Night

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="titreDemo.titre_sombre." parent="titreDemo">
        <item name="android:textColor">@color/jaune</item>
    </style>
</resources>

Orientation / mode vertical

  • Dans activity_main.xml, Split le code. Clique droit sur le 2 eme onglet (un telephone qui troune) et choisir) Create Landscape Variation
  • Le dossier activity_main est apparu dans le dossier Layout
    • deux dossier. Celui qui à (land) est celui pour l'orientation paysage
  • Je vais mettre mon titre au centre quand on est en mode paysage
<TextView
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:text="Mon titre"
   style="@style/titreDemo"
   android:gravity="center"
   />

ajouter une bordure dans le dossier drawable

clique droit sur le dossier drawable

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
   <corners android:radius="20dp"/>
   <padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
   <stroke android:width="1dp" android:color="#FF000000"/>
</shape>

Apres il suffit de l'utiliser sur votre layout android:background="@drawable/bordure"

Bouton qui change de couleur quand on clique dessus

Le fichier de style

Fichier Main

  • Si setSupportBackgroundTintList est rouge c'est que vous devez rajouter ceci dans le gradle :

    android {
        compileSdkVersion 30
        buildToolsVersion "30.0.3"
    
    lintOptions {
        disable 'RestrictedApi'
    }```
    
    
public class MainActivity extends AppCompatActivity {

    private AppCompatButton btnAPresser;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        btnAPresser = findViewById(R.id.btn_compact);

        // Version 1
        int[][] statut = new int[][] {
                new int[]{android.R.attr.state_pressed}, // Pressé
                new int[]{android.R.attr.state_enabled} // Relaché
        };
        int[] couleurs = new int[] {
                ContextCompat.getColor(this, R.color.purple_200), // Couleur pressée
                ContextCompat.getColor(this, R.color.purple_700) // Couleur normal
        };
        btnAPresser.setSupportBackgroundTintList(new ColorStateList(statut, couleurs));
    }
}