webentwicklung-frage-antwort-db.com.de

Wie kann ich die Textgröße der Navigationsansicht ändern?

Google vor kurzem veröffentlicht das Android.support.design.widget.NavigationView-Widget als Teil der com.Android.support:design:22.2.0-Bibliothek, die die Erstellung eines NavigationDrawer erheblich vereinfachte (und standardisiert).

Gemäß den Design-Spezifikationen sollte das Listenelement jedoch Roboto Medium, 14sp, 87% # 000000 sein. Die NavigationView macht keine textSize oder textStyle verfügbar, um dies anzupassen.

Material design specsFont style info

Welche Möglichkeiten habe ich, wenn ich die korrekten Designvorgaben mit der von Google zur Verfügung gestellten NavigationView pflegen möchte (oder sie auf andere Weise anpassen möchte)?

54
jay

Seit der Android Support Library 22.2.1 hat Google die Standardtextgröße für Elemente in NavigationView von 16sp auf 14sp geändert. In einigen Fällen (z. B. wenn Sie die chinesische Sprache unterstützen möchten), scheint textSize größer zu sein. Lösung ist einfach:

  1. fügen Sie app:theme="@style/yourStyle.Drawer" zu Ihrer NavigationView in Ihrer layout.xml hinzu
  2. fügen Sie in styles.xml Android:textSize="16sp" im Stil yourStyle.Drawer hinzu.
51
ywwynm

stil schaffen

<style name="NavigationDrawerStyle">

        <item name="Android:textSize">20sp</item><!-- text size in menu-->

        <!-- item size in menu-->
        <item name="Android:listPreferredItemHeightSmall">40dp</item>
        <item name="listPreferredItemHeightSmall">40dp</item>

        <!-- item padding left in menu-->
        <item name="Android:listPreferredItemPaddingLeft">8dp</item>
        <item name="listPreferredItemPaddingLeft">8dp</item>

        <!-- item padding right in menu-->
        <item name="Android:listPreferredItemPaddingRight">8dp</item>
        <item name="listPreferredItemPaddingRight">8dp</item>
    </style>

fügen Sie es Ihrer main_layout.xml hinzu

  <Android.support.design.widget.NavigationView
       ...
        app:theme="@style/NavigationDrawerStyle"
       ....>


    </Android.support.design.widget.NavigationView>

alle Params (die Sie ändern können) befinden sich hier Ändern Sie die Navigationselemente. 

Sie können auch *.xml-Datei überschreiben (Datei aus ...\sdk\extras\Android\support\design\res\layout\design_navigation_item.xml kopieren). Erstellen Sie einfach in Ihrem app/src/main/res/layout-Ordner ein Layout mit dem Namen: 

design_navigation_item.xml 

<Android.support.design.internal.NavigationMenuItemView
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:layout_width="match_parent"
    Android:layout_height="?attr/listPreferredItemHeightSmall"
    Android:paddingLeft="?attr/listPreferredItemPaddingLeft"
    Android:paddingRight="?attr/listPreferredItemPaddingRight"
    Android:drawablePadding="@dimen/navigation_icon_padding"
    Android:gravity="center_vertical|start"
    Android:maxLines="1"
    Android:fontFamily="sans-serif-thin"
    Android:textSize="22sp"
    Android:textAppearance="?attr/textAppearanceListItem" />

alle Layouts, die überschrieben werden können, befinden sich hier ...\sdk\extras\Android\support\design\res\layout\

design_layout_snackbar.xml
design_layout_snackbar_include.xml
design_layout_tab_icon.xml
design_layout_tab_text.xml
design_navigation_item.xml
design_navigation_item_header.xml
design_navigation_item_separator.xml
design_navigation_item_subheader.xml
design_navigation_menu.xml

[UPDATE] Jede Version von com.Android.support:design-{version} lib muss verschiedene Elemente überschreiben. Überprüfen Sie alles, was Sie brauchen 

 enter image description here

95
NickUnuchek

Sie können in Ihrer style.xml alles von der Textfarbe bis zur Größe und Schriftart anpassen

<style name="NavDrawerTextStyle" parent="Base.TextAppearance.AppCompat">
    <item name="Android:textColor">@color/colorPrimaryDark</item>
    <item name="Android:textSize">16sp</item>
    <item name="Android:textStyle">bold</item>
</style>

und dann in deiner NavigationView:

<Android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:fitsSystemWindows="true"
tools:openDrawer="start">

<Android.support.design.widget.NavigationView
    ...
    Android:itemTextAppearance="@style/NavDrawerTextStyle"
     />

48

sie können diese Attribute in einer XML-Datei verwenden

app:itemTextAppearance="?android:attr/textAppearanceMedium"

oder für kleinen Text

app:itemTextAppearance="?android:attr/textAppearance"

oder für großen Text

app:itemTextAppearance="?android:attr/textAppearanceLarge"
13
Mostafa Anter

Das hat für mich funktioniert:

activity_main.xml

<Android.support.design.widget.NavigationView
    Android:id="@+id/navigation_view"
    Android:layout_width="wrap_content"
    Android:layout_height="match_parent"
    Android:layout_gravity="start"
    Android:theme="@style/NavigationDrawerStyle"
    app:headerLayout="@layout/navdrawer_header"
    app:menu="@menu/navdrawer_menu" />

styles.xml

<style name="NavigationDrawerStyle">
    <item name="Android:textSize">16sp</item>
</style>

Durchsuchen des Quellcodes Ich habe diese Layoutdatei gefunden

/platform/frameworks/support/.../design/res/layout/design_drawer_item.xml

mit dem folgenden Attribut

<Android.support.design.internal.NavigationMenuItemView
    ...
    Android:textAppearance="?attr/textAppearanceListItem"

Wir mussten also nur den textAppearanceListItem-Stil in unserem Projekt überschreiben.


res/values ​​/ styles.xml

<style name="AppTheme" ... >
    ...
    <item name="textAppearanceListItem">@style/list_item_appearance</item>
</style>

<style name="list_item_appearance">
    <item name="Android:textSize">14sp</item>
    <item name="Android:fontFamily">sans-serif-medium</item>
</style>

Ich bin mir nicht ganz sicher, was sich sonst noch darauf auswirkt, aber wenn jemand eine bessere Antwort hat, würde ich das lieber akzeptieren.

6
jay

Vielleicht könnte es helfen. Vor kurzem musste ich das programmgesteuert machen ... Ich habe diese Klasse benutzt:

public class CustomTypefaceSpan extends TypefaceSpan {

private final Typeface newType;
private final float newSp;

public CustomTypefaceSpan(String family, Typeface type, float sp) {
    super(family);
    newType = type;
    newSp = sp;
}

@Override
public void updateDrawState(TextPaint ds) {
    applyCustomTypeFace(ds, newType, newSp);
}

@Override
public void updateMeasureState(TextPaint Paint) {
    applyCustomTypeFace(Paint, newType, newSp);
}

private static void applyCustomTypeFace(Paint paint, Typeface tf, float sp) {
    int oldStyle;
    Typeface old = Paint.getTypeface();
    if (old == null) {
        oldStyle = 0;
    } else {
        oldStyle = old.getStyle();
    }

    int fake = oldStyle & ~tf.getStyle();
    if ((fake & Typeface.BOLD) != 0) {
        Paint.setFakeBoldText(true);
    }

    if ((fake & Typeface.ITALIC) != 0) {
        Paint.setTextSkewX(-0.25f);
    }

    Paint.setTextSize(sp);
    Paint.setTypeface(tf);
}

@SuppressWarnings("unused")
public static final Parcelable.Creator<CustomTypefaceSpan> CREATOR = new Parcelable.Creator<CustomTypefaceSpan>() {
    @Override
    public CustomTypefaceSpan createFromParcel(Parcel in) {
        return null;
    }

    @Override
    public CustomTypefaceSpan[] newArray(int size) {
        return new CustomTypefaceSpan[size];
    }
};
}

Dann habe ich so benutzt:

// This is for color
SpannableString s = new SpannableString(item.getTitle().toString());
                    s.setSpan(new ForegroundColorSpan(Color.RED), 0, s.length(), 0);

// This is for typeface and size
Typeface typeFace = Functions.getTypeface(this, "Avenir");

if (typeFace != null) {
    int size = 19;
    float scaledSizeInPixels = size * getResources().getDisplayMetrics().scaledDensity;
    CustomTypefaceSpan spanTypeFace = new CustomTypefaceSpan(item.getTitle().toString(), typeFace, scaledSizeInPixels);
    s.setSpan(spanTypeFace, 0, s.length(), 0);
}
item.setTitle(s);

Hoffe das hilft.

2

Listenadapterlayout Ihrer Navigationsleiste:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:layout_width="match_parent"
Android:layout_height="match_parent"
Android:orientation="vertical">

<RelativeLayout
    Android:layout_width="match_parent"
    Android:layout_height="wrap_content" 
    Android:padding="10dp"
    Android:orientation="horizontal"
    Android:background="@drawable/pressed_state">

    <TextView
        Android:id="@+id/textView_list_item"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:layout_centerVertical="true"
        Android:layout_toRightOf="@+id/imageView_icons"
        Android:textStyle="bold"
        Android:layout_marginLeft="10dp"
        Android:textColor="@color/white"
        Android:textSize="17sp" />


    <ImageView 
        Android:id="@+id/list_adapter_image"
        Android:layout_width="10dp"
        Android:layout_height="10dp"
        Android:layout_centerVertical="true"
        Android:layout_alignParentRight="true"
        Android:visibility="visible"
        Android:layout_marginRight="50dp"
        Android:background="@drawable/circle_orange"/>

</RelativeLayout>

<LinearLayout 
    Android:layout_height="1dp"
    Android:layout_width="match_parent"
    Android:background="#EC1294"></LinearLayout>

</LinearLayout>

Dieser Parameter in RelativeLayout legt die Hintergrundfarbe fest -> Android: background = "@ drawable/pressure_state"

Machen Sie diese "gepresste_State.xml" in einen Draw-Ordner.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.Android.com/apk/res/Android" >

 <item Android:drawable="@color/light_blue" Android:state_pressed="true"/>

Entschuldige mich für mein Englisch.

0
Chaudhary Amar
  1. Öffnen oder erstellen Sie values ​​\ dimens.xml
  2. Fügen Sie diesen Code hinzu:

    <dimen name = "design_bottom_navigation_text_size" tools: override = "true"> 11sp </ dimen > <dimen name = "design_bottom_navigation_active_text_size" tools: override = "true"> 12sp </ dimen>

Es sollte funktionieren

PS nach <vor dem Maß entfernen

0

Gehen Sie zu activity_main.xml und wählen Sie nav_view in design und Sie können die Textgröße des Menüelements ändern, indem Sie itemTextAppearance und itemTextColor wie folgt vorgehen  navigation_view_item_style 

0
poornima