Android araç çubuğu merkezi başlığı ve özel yazı tipi


366

Araç çubuğu başlığı için özel bir yazı tipi kullanmak ve araç çubuğunda (istemci gereksinimi) ortalamak için doğru yolu anlamaya çalışıyorum.

Şu anda, iyi eski ActionBar kullanıyorum ve başlığı boş değere ayarlıyordum ve setCustomViewbenim özel yazı tipi TextView koymak ve ActionBar.LayoutParams kullanarak ortalamak için kullanıyordum.

Bunu yapmanın daha iyi bir yolu var mı? Yeni Araç Çubuğunu ActionBar'ım olarak kullanma.

Yanıtlar:


718

Özel bir başlık kullanmak için Toolbaryapmanız gereken tek şey hatırlamak olduğunu Toolbarsadece süslü bir ViewGroup böylece böyle bir özel başlık ekleyebilirsiniz:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:minHeight="?attr/actionBarSize"
    android:background="@color/action_bar_bkgnd"
    app:theme="@style/ToolBarTheme" >


     <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Toolbar Title"
        android:layout_gravity="center"
        android:id="@+id/toolbar_title" />


    </android.support.v7.widget.Toolbar>

Bu, istediğiniz gibi şekillendirebileceğiniz anlamına gelir, TextViewçünkü bu sadece normaldir TextView. Böylece etkinliğinizde başlığa şu şekilde erişebilirsiniz:

Toolbar toolbarTop = (Toolbar) findViewById(R.id.toolbar_top);
TextView mTitle = (TextView) toolbarTop.findViewById(R.id.toolbar_title);

5
android kullanmanızı öneririz: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_gravity = "center" yerine.
SteelBytes

194
Başka biri varsayılan uygulama adı başlığını kaldıramazsa, bunu yapın: 1. setSupportActionBar (yourToolbar) öğesini arayın 2. getSupportActionBar () öğesini arayın. SetDisplayShowTitleEnabled (false);
Rick Sanchez

75
Özelleştirilmiş TextView için varsayılan stilleri kullanmaya devam etmek için aşağıdaki gibi bir şey deneyin style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"( bu cevaba bakınız ).
Jonik

5
android ekleme: paddingRight = "? attr / actionBarSize", bir düğmeniz olması durumunda metni ekranınızın ortasında ortalamanıza yardımcı olabilir (ev, gezinti çekmecesi, vb.)
Gordak

5
Araç Çubuğu'nda Hamburger simgesi olduğunda ne olacak? Tam araç çubuğu genişliğinin merkezinde olmayacak, ToolbarWidth - HamburgerIconWidth'in merkezinde olacaktır .
Akshay

75

Araç Çubuğu başlığı stilize edilebilir. Yaptığınız herhangi bir özelleştirmenin temada yapılması gerekir. Size bir örnek vereceğim.

Araç çubuğu düzeni:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    style="@style/ToolBarStyle.Event"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:minHeight="@dimen/abc_action_bar_default_height_material" />

stiller:

<style name="ToolBarStyle" parent="ToolBarStyle.Base"/>

<style name="ToolBarStyle.Base" parent="">
    <item name="popupTheme">@style/ThemeOverlay.AppCompat.Light</item>
    <item name="theme">@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>

<style name="ToolBarStyle.Event" parent="ToolBarStyle">
    <item name="titleTextAppearance">@style/TextAppearance.Widget.Event.Toolbar.Title</item>
</style>

<style name="TextAppearance.Widget.Event.Toolbar.Title" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
    <!--Any text styling can be done here-->
    <item name="android:textStyle">normal</item>
    <item name="android:textSize">@dimen/event_title_text_size</item>
</style>

59
Doğru yol budur. Başka TextViewbir tane eklemek biraz acayip, ama yansıma cevabı sadece kötülük.
DariusL

9
Temiz, ancak stilden özel bir yazı tipi ayarlayamazsınız. Ne yazık ki.
niqueco

20
Başlığın hizalamasını da değiştiremezsiniz.
Terry

7
@ user1560102 Araç Çubuğuna bir TextView eklemekle ilgili bir şey yoktur. Bunun için tasarlandı.
Tim Malseed

107
Bu metni ortalamaz.
Sebastian Roth

69

Bu sadece @Jonik ve @Rick Sanchez ile @ MrEngineer13 cevabını kullanarak tüm parçalara katılmak için yardımcı olmak için başlık kolayca elde yardımcı olmak için doğru sipariş ile !!

Şununla düzen TextAppearance.AppCompat.Widget.ActionBar.Title:

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay">

        <TextView
            android:id="@+id/toolbar_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"                      
            style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"
            android:layout_gravity="center" />

    </android.support.v7.widget.Toolbar>

Doğru sipariş ile ulaşmanın yolu:

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    TextView mTitle = (TextView) toolbar.findViewById(R.id.toolbar_title);

    setSupportActionBar(toolbar);
    mTitle.setText(toolbar.getTitle());

    getSupportActionBar().setDisplayShowTitleEnabled(false);

Lütfen @ MrEngineer13 cevap vermeyi unutmayın !

İşte örnek bir proje ToolbarCenterTitleSample

resim açıklamasını buraya girin

Başka birine yardım etmeyi umuyoruz;)


5
setDisplayHomeAsUpEnabled (true) ve setDisplayShowHomeEnabled (true) ayarladıysam; geri oku enalbe etmek için. O zaman unvan merkeze gelmiyor. ActionBar.setTitle ("") ayarlamayı denedim; ve setDisplayShowTitleEnabled (yanlış). Ama yine de sorunu çözemiyoruz
Prashanth Debbadwar

Bunu bir için test ettiniz Scrolling Activitymi?
AN

geri ok ile başlığın ortalanmadığı doğrudur (sağa geri ok genişliğinin yarısı kadar kapalıdır). Sanırım gerçekten belirlenmiş olsaydım, programlı olarak metni ortalamak için gerektiğinde metin kutusunun sağına yeterli kenar boşluğu eklerdim.
Birisi

52

Araç Çubuğu başlığı TextView'e doğrudan erişimimiz olmadığından, erişmek için yansıma kullanıyoruz.

  private TextView getActionBarTextView() {
    TextView titleTextView = null;

    try {
        Field f = mToolBar.getClass().getDeclaredField("mTitleTextView");
        f.setAccessible(true);
        titleTextView = (TextView) f.get(mToolBar);
    } catch (NoSuchFieldException e) {
    } catch (IllegalAccessException e) {
    }
    return titleTextView;
}

3
Her ne kadar bu hacky olsa da, bu çözüm araç çubuğu metin görünümüne erişmek için bir yol bulmaya çalıştıktan sonra benim için çalışıyor. Teşekkür ederim.
falc0nit3

1
Başlık için güzel çalıştı. Ancak böyle mSubtitleTextView elde etmeye çalışıldığında, bir istisna ile sonuçlandı. Nedeni: java.lang.NullPointerException: Boş bir nesne başvurusunda 'void android.widget.TextView.setTypeface (android.graphics.Typeface)' sanal yöntemini çağırmayı
deneyin

5
Not: Araç çubuğu başlığını ayarladıktan sonra yalnızca "mTitleTextView" alanına erişebilirsiniz! Alan ilk kullanımıyla tembel hale getirilir.
funcoder

2
Kodunuzu ProGuard ile karıştırırsanız ve mTitleTextViewolur abcde12345mu?
voghDev

1
@voghDev getDeclaredField, bu durumda NoSuchFieldException özel durumunu oluşturur ve bu da kodun çalışmamasına neden olur.
Jeremy

30

İşte TextViewörnek bulmak için başlık metnine bağlı yaklaşım Toolbar.

  public static TextView getToolbarTitleView(ActionBarActivity activity, Toolbar toolbar){
    ActionBar actionBar = activity.getSupportActionBar();
    CharSequence actionbarTitle = null;
    if(actionBar != null)
        actionbarTitle = actionBar.getTitle();
    actionbarTitle = TextUtils.isEmpty(actionbarTitle) ? toolbar.getTitle() : actionbarTitle;
    if(TextUtils.isEmpty(actionbarTitle)) return null;
    // can't find if title not set
    for(int i= 0; i < toolbar.getChildCount(); i++){
        View v = toolbar.getChildAt(i);
        if(v != null && v instanceof TextView){
            TextView t = (TextView) v;
            CharSequence title = t.getText();
            if(!TextUtils.isEmpty(title) && actionbarTitle.equals(title) && t.getId() == View.NO_ID){
                //Toolbar does not assign id to views with layout params SYSTEM, hence getId() == View.NO_ID
                //in same manner subtitle TextView can be obtained.
                return t;
            }
        }
    }
    return null;
}

28

Aşağıdaki sınıfı tanımlayın:

public class CenteredToolbar extends Toolbar {

    private TextView centeredTitleTextView;

    public CenteredToolbar(Context context) {
        super(context);
    }

    public CenteredToolbar(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
    }

    public CenteredToolbar(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void setTitle(@StringRes int resId) {
        String s = getResources().getString(resId);
        setTitle(s);
    }

    @Override
    public void setTitle(CharSequence title) {
        getCenteredTitleTextView().setText(title);
    }

    @Override
    public CharSequence getTitle() {
        return getCenteredTitleTextView().getText().toString();
    }

    public void setTypeface(Typeface font) {
        getCenteredTitleTextView().setTypeface(font);
    }

    private TextView getCenteredTitleTextView() {
        if (centeredTitleTextView == null) {
            centeredTitleTextView = new TextView(getContext());
            centeredTitleTextView.setTypeface(...);
            centeredTitleTextView.setSingleLine();
            centeredTitleTextView.setEllipsize(TextUtils.TruncateAt.END);
            centeredTitleTextView.setGravity(Gravity.CENTER);
            centeredTitleTextView.setTextAppearance(getContext(), R.style.TextAppearance_AppCompat_Widget_ActionBar_Title);

            Toolbar.LayoutParams lp = new Toolbar.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
            lp.gravity = Gravity.CENTER;
            centeredTitleTextView.setLayoutParams(lp);

            addView(centeredTitleTextView);
        }
        return centeredTitleTextView;
    }
}

... ve daha sonra bunun yerine normal kullanın Toolbar:

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/colorAccent">

        <your.packagename.here.CenteredToolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="?attr/actionBarTheme"
            app:title="@string/reset_password_page_title"/>

        <!-- Other views -->

</RelativeLayout>

Hala bu 2 kod satırına ihtiyacınız var Activity(standartta olduğu gibi Toolbar):

Toolbar toolbar = (Toolbar) findViewByid(R.id.toolbar); // note that your activity doesn't need to know that it is actually a custom Toolbar
setSupportActionBar(binding.toolbar);

Bu kadar! Standart sola hizalanmış başlığını gizlemek için gerek yok, sadece kullanmak, vb defalarca aynı XML kodu çoğaltmak gerekmez CenteredToolbarvarsayılan olsaydı gibi Toolbar. Özel yazı tipinizi, artık doğrudan erişiminiz olduğundan programlı olarak da ayarlayabilirsiniz TextView. Bu yardımcı olur umarım.


1
Teşekkürler! En iyi çözüm, sadece "v7.widget" araç çubuğuna almak unutmamak için
David

Bunun oldukça eski olduğunu biliyorum ama ... metin rengini nasıl değiştirebilirim? XML app: titleTextColor ve centeredTitleTextView.setColor kodunu denedim. Herhangi bir fikir, @fraggjkee?
Genaro Alberto Cancino Herrera

centeredTitleTextView.setTextColor(...)çalışması gerekir
fraggjkee

Olmamalı mı LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT)?
liminal

16

Kimse bundan bahsetmedi, ancak bunun için bazı özellikler var Toolbar:

app:titleTextColor başlık metni rengini ayarlamak için

app:titleTextAppearance başlık metni görünümünü ayarlamak için

app:titleMargin marjı ayarlamak için

Ve marginStartvb. Gibi spesifik kenar boşlukları da var .


1
Mükemmel Çözüm .. FontOverride'ın farkındaysanız, styles.xml dosyasında stil oluşturun <style name="customFontTextAppearanceStyle"> <item name="android:textSize">18sp</item> <item name="android:typeface">monospace</item> ve araç çubuğuna uygulayın app:titleTextAppearance="@styles/customFontTextAppearanceStyle"
Chinmay Thoriya

2
Bu yöntemi kullandım ama araç çubuğuma hiçbir şey olmadı! i '<style>' Yeni oluşturulan ve ayarlayın app:titleTextAppearanc="style name" üzerine android.support.v7.widget.ToolbarTAG
AN

12

Bu çözümü kullanıyorum:

static void centerToolbarTitle(@NonNull final Toolbar toolbar) {
    final CharSequence title = toolbar.getTitle();
    final ArrayList<View> outViews = new ArrayList<>(1);
    toolbar.findViewsWithText(outViews, title, View.FIND_VIEWS_WITH_TEXT);
    if (!outViews.isEmpty()) {
        final TextView titleView = (TextView) outViews.get(0);
        titleView.setGravity(Gravity.CENTER);
        final Toolbar.LayoutParams layoutParams = (Toolbar.LayoutParams) titleView.getLayoutParams();
        layoutParams.width = ViewGroup.LayoutParams.MATCH_PARENT;
        toolbar.requestLayout();
        //also you can use titleView for changing font: titleView.setTypeface(Typeface);
    }
}

1
Çok iyi çalışıyor, ancak bir nedenden ötürü bir öğe düğmesi olmayan araç çubuklarıyla düzgün bir şekilde ortalanmıyor.
Munib

1
Ek olarak: araç çubuğunda bir gezinme veya geri simgesiniz varsa, başlık tam olarak ortada kalmaz. Bu durum için boş bir ayar menüsü simgesi ekliyorum. Boş menü öğem: <item android: id = "@ + id / empty" android: orderInCategory = "100" android: icon = "@ android: renk / şeffaf" app: showAsAction = "always" araçlar: ignore = " MenuTitle "/>
Mete

10

TextView araç çubuğu olmadan aşağıdaki kodu kullanarak yazı tipini özelleştirebiliriz

getSupportActionBar().setDisplayShowTitleEnabled(false);
or
getActionBar().setDisplayShowTitleEnabled(false);

public void updateActionbar(String title){
    SpannableString spannableString = new SpannableString(title);
    spannableString.setSpan(new TypefaceSpanString(this,  "futurastdmedium.ttf"),
            0, spannableString.length(),
            Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    mToolbar.setTitle(spannableString);
}

1
Sadece yazı tipini değiştirmeniz gerekiyorsa, bu en temiz çözüm gibi görünüyor. NOT: TypefaceSpanString sadece şu
şekildedir

8
    public class TestActivity extends AppCompatActivity {
    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        super.setContentView(R.layout.activity_test);

        toolbar = (Toolbar) findViewById(R.id.tool_bar); // Attaching the layout to the toolbar object
        setSupportActionBar(toolbar);

        customizeToolbar(toolbar);
    }

    public void customizeToolbar(Toolbar toolbar){
        // Save current title and subtitle
        final CharSequence originalTitle = toolbar.getTitle();
        final CharSequence originalSubtitle = toolbar.getSubtitle();

        // Temporarily modify title and subtitle to help detecting each
        toolbar.setTitle("title");
        toolbar.setSubtitle("subtitle");

        for(int i = 0; i < toolbar.getChildCount(); i++){
            View view = toolbar.getChildAt(i);

            if(view instanceof TextView){
                TextView textView = (TextView) view;


                if(textView.getText().equals("title")){
                    // Customize title's TextView
                    Toolbar.LayoutParams params = new Toolbar.LayoutParams(Toolbar.LayoutParams.WRAP_CONTENT, Toolbar.LayoutParams.MATCH_PARENT);
                    params.gravity = Gravity.CENTER_HORIZONTAL;
                    textView.setLayoutParams(params);

                    // Apply custom font using the Calligraphy library
                    Typeface typeface = TypefaceUtils.load(getAssets(), "fonts/myfont-1.otf");
                    textView.setTypeface(typeface);

                } else if(textView.getText().equals("subtitle")){
                    // Customize subtitle's TextView
                    Toolbar.LayoutParams params = new Toolbar.LayoutParams(Toolbar.LayoutParams.WRAP_CONTENT, Toolbar.LayoutParams.MATCH_PARENT);
                    params.gravity = Gravity.CENTER_HORIZONTAL;
                    textView.setLayoutParams(params);

                    // Apply custom font using the Calligraphy library
                    Typeface typeface = TypefaceUtils.load(getAssets(), "fonts/myfont-2.otf");
                    textView.setTypeface(typeface);
                }
            }
        }

        // Restore title and subtitle
        toolbar.setTitle(originalTitle);
        toolbar.setSubtitle(originalSubtitle);
    }
}

1
Çözümü, kodun son iki satırını koyduğunuzda harika çalışır, for döngüsünün içinde olmamalıdır: // Başlığı ve altyazı geri yükleme toolbar.setTitle (originalTitle); toolbar.setSubtitle (originalSubtitle);
Ivan Stojkovic

5

Yerleşim:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:minHeight="?attr/actionBarSize"
    android:background="@color/action_bar_bkgnd"
    app:theme="@style/ToolBarTheme" >

     <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Toolbar Title"
        android:layout_gravity="center"
        android:gravity="center"
        android:id="@+id/toolbar_title" />
</android.support.v7.widget.Toolbar>

Kod:

    Toolbar mToolbar = parent.findViewById(R.id.toolbar_top);
    TextView mToolbarCustomTitle = parent.findViewById(R.id.toolbar_title);

    //setup width of custom title to match in parent toolbar
    mToolbar.postDelayed(new Runnable()
    {
        @Override
        public void run ()
        {
            int maxWidth = mToolbar.getWidth();
            int titleWidth = mToolbarCustomTitle.getWidth();
            int iconWidth = maxWidth - titleWidth;

            if (iconWidth > 0)
            {
                //icons (drawer, menu) are on left and right side
                int width = maxWidth - iconWidth * 2;
                mToolbarCustomTitle.setMinimumWidth(width);
                mToolbarCustomTitle.getLayoutParams().width = width;
            }
        }
    }, 0);

1
Bence "int width = maxWidth - titleWidth * 2;" "int width = maxWidth - iconWidth * 2;" olmalı, diye düşünüyor!
oldfeel

4

Bu çözümü çözdüm, Ve bu aşağıdaki kodlar:

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" >

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Order History"
            android:layout_gravity="center"
            android:id="@+id/toolbar_title"
            android:textSize="17sp"
            android:textStyle="bold"
            android:textColor="@color/colorWhite"
            />

    </android.support.v7.widget.Toolbar>

Ve başlığı / etiketi değiştirebilir, Etkinlik'te aşağıdaki kodları yazabilirsiniz:

Toolbar toolbarTop = (Toolbar) findViewById(R.id.toolbar_top);

TextView mTitle = (TextView) araç çubuğuTop.findViewById (R.id.toolbar_title); mTitle.setText ( "dizesi @ / ....");


4

Aşağıdaki gibi kullanabilirsiniz

 <android.support.v7.widget.Toolbar
    android:id="@+id/top_actionbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppThemeToolbar">

    <TextView
        android:id="@+id/pageTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        />
</android.support.v7.widget.Toolbar>

setDisplayHomeAsUpEnabled (true) ve setDisplayShowHomeEnabled (true) ayarladıysam; geri oku enalbe etmek için. O zaman unvan merkeze gelmiyor. ActionBar.setTitle ("") ayarlamayı denedim; ve setDisplayShowTitleEnabled (yanlış). Ama yine de sorunu çözemiyoruz
Prashanth Debbadwar

4

Özel bir yazı tipi ayarlamanın çok hızlı ve kolay bir yolu, aşağıdakileri titleTextAppearanceiçeren bir özel kullanmaktır fontFamily:

Styles.xml dosyasına ekle :

<style name="ToolbarTitle" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
    <item name="android:textSize">16sp</item>
    <item name="android:textColor">#FF202230</item>
    <item name="android:fontFamily">@font/varela_round_regular</item>
</style>

Sizin de res bir oluşturmak klasör yazı klasörü (Örn: varela_round_regular.ttf )

Daha fazla bilgi edinmek için resmi kılavuzu okuyun https://developer.android.com/guide/topics/ui/look-and-feel/fonts-in-xml.html


3

Appcompat kütüphanesinde bir şey değişti mi bilmiyorum ama oldukça önemsiz, düşünmeye gerek yok.

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

// loop through all toolbar children right after setting support 
// action bar because the text view has no id assigned

// also make sure that the activity has some title here
// because calling setText() with an empty string actually
// removes the text view from the toolbar

TextView toolbarTitle = null;
for (int i = 0; i < toolbar.getChildCount(); ++i) {
    View child = toolbar.getChildAt(i);

    // assuming that the title is the first instance of TextView
    // you can also check if the title string matches
    if (child instanceof TextView) {
        toolbarTitle = (TextView)child;
        break;
    }
}

3

Bu sorun için kullandığım çözüm:

 public static void applyFontForToolbarTitle(Activity a){
        Toolbar toolbar = (Toolbar) a.findViewById(R.id.app_bar);
        for(int i = 0; i < toolbar.getChildCount(); i++){
            View view = toolbar.getChildAt(i);
            if(view instanceof TextView){
                TextView tv = (TextView) view;
                if(tv.getText().equals(a.getTitle())){
                    tv.setTypeface(getRuneTypefaceBold(a));
                    break;
                }
            }
        }
    }

Merkezin yerçekimi için, yerleşim parametrelerini yatay olarak match_parent olarak değiştirmek ve sonra:

tv.setGravity(Gravity.CENTER);

3

@ MrEngineer13'ün cevabından güncelleme: Hamburger simgesi, seçenek menüleri de dahil olmak üzere her durumda başlık merkezini hizalamak için, aşağıdaki FrameLayoutgibi bir araç çubuğu ekleyebilirsiniz :

   <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:minHeight="?attr/actionBarSize"
    android:background="@color/action_bar_bkgnd"
    app:theme="@style/ToolBarTheme" >

         <FrameLayout android:layout_width="match_parent"
                    android:layout_height="match_parent">

              <TextView
               android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:text="Toolbar Title"
               android:layout_gravity="center"
               style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"
               android:id="@+id/toolbar_title" />

        </FrameLayout>

   </android.support.v7.widget.Toolbar>

3

XML'de şunu deneyin:

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="@color/action_bar_bkgnd"
app:theme="@style/ToolBarTheme" >


 <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Toolbar Title"
    android:layout_gravity="center"
    android:id="@+id/toolbar_title" />


</android.support.v7.widget.Toolbar>

Kodda:

Toolbar myToolbar= (Toolbar) findViewById(R.id.toolbar);
TextView mTitle = (TextView) mytoolbar.findViewById(R.id.toolbar_title);

2

Araç çubuğuna bir metin görünümü eklemek, başlık stilinin kısıtlanması sorununu çözebilse de, onunla ilgili bir sorun var. Bir düzene eklemediğimiz için genişliği üzerinde çok fazla kontrolümüz yok. Wrap_content veya match_parent kullanabiliriz.

Şimdi araç çubuğunun sağ kenarında düğme olarak bir searchView bulunan bir senaryo düşünelim. Başlık içeriği daha fazlaysa, düğmeyi gizleyen düğmenin üstüne gider. Etikete bir genişlik ayarlama kısa devre kontrol etmenin bir yolu yoktur ve duyarlı bir tasarıma sahip olmak istiyorsanız yapmak istemediğiniz bir şeydir.

İşte, araç çubuğuna metin görünümü eklemekten biraz farklı olan benim için çalışan bir çözüm. Bunun yerine, araç çubuğunu ve metin görünümünü göreceli bir düzene ekleyin ve metin görünümünün araç çubuğunun üstünde olduğundan emin olun. Ardından uygun kenar boşluklarını kullanabilir ve metin görünümünün görünmesini istediğimiz yerde göründüğünden emin olabiliriz.

Araç çubuğunu başlığı göstermeyecek şekilde ayarladığınızdan emin olun.

İşte bu çözüm için XML:

<RelativeLayout
                    android:orientation="horizontal"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="?attr/colorPrimary">

                    <android.support.v7.widget.Toolbar
                        android:theme="@style/ThemeOverlay.AppCompat.Dark"
                        android:id="@+id/activity_toolbar"
                        android:layout_width="match_parent"
                        android:layout_height="?attr/actionBarSize"
                        android:background="?attr/colorPrimary"
                        android:titleTextAppearance="@style/AppTheme.TitleTextView"
                        android:layout_marginRight="40dp"
                        android:layoutMode="clipBounds">

                        <android.support.v7.widget.SearchView
                            android:id="@+id/search_view"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="right"
                            android:layout_centerVertical="true"
                            android:layout_alignParentRight="true"
                            android:foregroundTint="@color/white" />
                        </android.support.v7.widget.Toolbar>

                    <TextView
                        android:id="@+id/toolbar_title"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginRight="90dp"
                        android:text="@string/app_name"
                        android:textSize="@dimen/title_text_size"
                        android:textColor="@color/white"
                        android:lines="1"
                        android:layout_marginLeft="72dp"
                        android:layout_centerVertical="true" />

                </RelativeLayout>

Yukarıda bahsedilen @ ankur-chaudhary sorununu çözer.


2

Çünkü android.support.v7.appcompat 24.2 Toolbaryöntemi vardır setTitleTextAppearanceve yazı tipini harici olmadan ayarlayabilirsiniz textview.

styles.xml dosyasında yeni stil oluştur

<style name="RobotoBoldTextAppearance">
        <item name="android:fontFamily">@font/roboto_condensed_bold</item>
</style>

ve kullan

mToolbar.setTitleTextAppearance(this, R.style.RobotoBoldTextAppearance);

2

Evrensel bir çözüm aramak için birkaç gün geçirdim. Benim araç çubuğu android menü ve nav simgesi ile çalışma.

İlk önce, özel araç çubuğu sınıfı oluşturmanız gerekir. Bu sınıf, başlık merkezli konumları (dolguları) hesaplamalıdır:

    class CenteredToolbar @JvmOverloads constructor(context: Context, attrs: AttributeSet? = null, defStyleAttr: Int = 0)
    : Toolbar(context, attrs, defStyleAttr) {

    init {
        addOnLayoutChangeListener(object : View.OnLayoutChangeListener {
            override fun onLayoutChange(v: View?, left: Int, top: Int, right: Int, bottom: Int, oldLeft: Int, oldTop: Int, oldRight: Int, oldBottom: Int) {
                val titleTextView = findViewById<TextView>(R.id.centerTitle)

                val x = titleTextView.x.toInt()
                val x2 = x + titleTextView.width

                val fullWidth = width
                val fullCenter = fullWidth / 2

                val offsetLeft = Math.abs(fullCenter - x)
                val offsetRight = Math.abs(x2 - fullCenter)
                val differOffset = Math.abs(offsetLeft - offsetRight)

                if (offsetLeft > offsetRight) {
                    titleTextView.setPadding(differOffset, 0, 0, 0)
                } else if (offsetRight > offsetLeft) {
                    titleTextView.setPadding(0, 0, differOffset, 0)
                }

                removeOnLayoutChangeListener(this)
            }
        })
    }

    override fun setTitle(resId: Int) = getTitleView().setText(resId)

    override fun setTitle(title: CharSequence?) = getTitleView().setText(title)

    fun getTitleView(): TextView = findViewById(R.id.centerTitle)

}

İkinci olarak, düzen araç çubuğu oluşturmanız gerekir:

<CenteredToolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar">

    <TextView
        android:id="@+id/centerTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

</CenteredToolbar>

Bu kadar


2

Araç Çubuğu'nu almayı deneyin ve ayrı bir görünümde yapıştırın. Sağ uçtan bir görünüm alın ve onlara araç çubuğu ağırlığına eşit ağırlık verin. Bu şekilde, küçüklüğünüz ortaya çıkacaktır.

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:background="@color/white_color">
  <LinearLayout
   android:id="@+id/toolbar_layout"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   android:background="@color/white_color">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="0dp"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/white_color"
        app:popupTheme="@style/AppTheme.PopupOverlay"
        app:contentInsetLeft="0dp"
        app:contentInsetStart="0dp"
        android:layout_weight="0.2"

        app:contentInsetStartWithNavigation="0dp"
        app:navigationIcon="@color/greyTextColor">
       </android.support.v7.widget.Toolbar>


        <com.an.customfontview.CustomTextView
            android:id="@+id/headingText"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.6"
            android:gravity="center"
            android:text="Heading"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:textColor="@color/colorPrimary"
            android:textSize="@dimen/keyboard_number"
            android:layout_gravity="center_horizontal|center_vertical"
            app:textFontPath="fonts/regular.ttf" />
            <ImageView
                android:id="@+id/search_icon"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_alignParentEnd="true"
                android:layout_centerVertical="true"
                android:visibility="visible"
                android:layout_weight="0.2"
                android:layout_gravity="center_horizontal|center_vertical"
                android:src="@drawable/portfolio_icon"/>
        </LinearLayout>

       </android.support.design.widget.AppBarLayout>

2

Bu kodu xml dosyanıza ekleyebilirsiniz

 <androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimaryDark"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.ActionBar">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Toolbar Title"
        android:textColor="#000000"
        android:textSize="20dp"
        android:id="@+id/toolbar_title" />

</androidx.appcompat.widget.Toolbar>

Merhaba Uzair. Hangi xml dosyası? Boş Etkinlik şablonundan oluşturulan bir Android Studio 3.6.3 Projesi kullanıyorum. Teşekkürler.
Sevgi ve barış - Joe Codeswell

1
private void makeTitleCenter(String title, Toolbar toolbar) {
    if (title != null && !TextUtils.isEmpty(title.trim())) {
        final String tag = " ";
        if (getSupportActionBar() != null) {
            getSupportActionBar().setTitle(tag);
        }
        TextView titleTv = null;
        View leftBtn = null;
        for (int i = 0; i < toolbar.getChildCount(); i++) {
            View view = toolbar.getChildAt(i);
            CharSequence text = null;
            if (view instanceof TextView && (text = ((TextView) view).getText()) != null && text.equals(tag)) {
                titleTv = (TextView) view;
            } else if (view instanceof ImageButton) {
                leftBtn = view;
            }
        }
        if (titleTv != null) {
            final TextView fTitleTv = titleTv;
            final View fLeftBtn = leftBtn;
            fTitleTv.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
                @Override
                public void onGlobalLayout() {
                    fTitleTv.getViewTreeObserver().removeOnGlobalLayoutListener(this);
                    int leftWidgetWidth = fLeftBtn != null ? fLeftBtn.getWidth() : 0;
                    fTitleTv.setPadding(DimenUtil.getResources().getDisplayMetrics().widthPixels / 2 - leftWidgetWidth - fTitleTv.getWidth() / 2, 0, 0, 0);
                    fTitleTv.requestLayout();
                }
            });
        }
    }
}

1

Ayar android:gravity="center"benim için çalıştı

Şekillendirici bir şey yok. Araç Çubuğu temelde ViewGroupyapmanız gereken tek şey, içindeki öğelerin yerçekimini ayarlamaktır.

        <android.support.v7.widget.Toolbar
            android:id="@+id/htab_toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:layout_gravity="top"
            android:background="@color/partial_transparent"
            android:gravity="center"
            app:layout_collapseMode="pin"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

8
androidx.appcompat.widget.Toolbar
İle

1

araç çubuğundaki özel yazı tipi için textView yazı tipini geçersiz kılabilirsiniz ve daha sonra uygulamanızdaki her textView ayrıca araç çubuğu başlık yazı tipi otomatik olarak değişti ve android stüdyosunda test ettim 3.1.3

tarzı yapmak:

<style name="defaultTextViewStyle" parent="android:Widget.TextView">
        <item name="android:fontFamily">@font/your_custom_font</item>
</style>

ve sonra temanızda şunu kullanın:

<item name="android:textViewStyle">@style/defaultTextViewStyle</item>

1

Herhangi bir adicional Java / Kotlin kodu olmadan özel araç çubuğu eklemek için başka bir yol buldum.

  • İlk olarak, üst araç olarak AppBarLayout ile özel araç çubuğu düzeninizle bir XML oluşturun:

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.design.widget.AppBarLayout                     
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">
    
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay">
    
        <ImageView
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:layout_gravity="right"
            android:layout_marginEnd="@dimen/magin_default"
            android:src="@drawable/logo" />
    
    </android.support.v7.widget.Toolbar>

  • İkinci olarak: Araç çubuğunu düzeninize ekleyin:

    <?xml version="1.0" encoding="utf-8"?>                
    <android.support.constraint.ConstraintLayout 
        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"
        android:background="@color/blue"
        tools:context=".app.MainAcitivity"
        tools:layout_editor_absoluteY="81dp">
    
        <include
            layout="@layout/toolbar_inicio"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />
    
        <!-- Put your layout here -->
    
    </android.support.constraint.ConstraintLayout>

1

Gördüğüm gibi iki seçeneğiniz var:

1) Araç çubuğu XML'sini düzenleyin. Araç Çubuğunuz XML'e eklendiğinde genellikle şöyle görünür:

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:elevation="4dp"
    app:popupTheme="@style/AppTheme.PopupOverlay"/>

özelleştirmek istiyorsanız sonunda '/' işaretini kaldırın ve şöyle yapın:

<android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:elevation="4dp"
            app:popupTheme="@style/AppTheme.PopupOverlay">

            <android.support.constraint.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <ImageView
                    android:id="@+id/toolbar_iv"
                    android:layout_width="30dp"
                    android:layout_height="30dp"
                    android:src="@mipmap/ic_launcher"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintLeft_toLeftOf="parent"
                    app:layout_constraintTop_toTopOf="parent" />

                <TextView
                    android:id="@+id/toolbar_tv"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_marginLeft="20dp"
                    android:gravity="center"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintLeft_toRightOf="@+id/toolbar_iv"
                    app:layout_constraintTop_toTopOf="parent" />

            </android.support.constraint.ConstraintLayout>
        </android.support.v7.widget.Toolbar>

bu şekilde bir araç çubuğunuz olabilir ve metin görünümünü ve logoyu özelleştirebilirsiniz.

2) Yerel metin görünümünü ve simgeyi programlı olarak değiştirin:

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setIcon(R.drawable.ic_question_mark);
getSupportActionBar().setTitle("Title");

içinde herhangi bir şey ayarlamadan önce araç çubuğunuzun boş olmadığından emin olun.


1

TextViewAraç çubuğunda şöyle bir özelliğe sahip olabilirsiniz :

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:minHeight="?attr/actionBarSize"
    android:background="@color/action_bar_bkgnd"
    app:theme="@style/ToolBarTheme" >

     <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Title"
        android:layout_gravity="center"
        android:id="@+id/toolbar_title" />


</android.support.v7.widget.Toolbar>

Bu, metni ortalayacaktır. Normal bir özel yazı tipi eklemek istiyorsanız Toolbar, aşağıdakileri yapın <style>:

<style android:name="ToolbarFont">
    <item android:fontFamily = "@font/fontName" />
</style>

Ve araç çubuğuna ekleyin:

toolbar.setTitleTextAppearance(this, R.style.ToolbarFont);

Araç çubuğundaki metin görünümü için bunu fontFamilyözellik ile tanımlayabilirsiniz :

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_top"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:minHeight="?attr/actionBarSize"
    android:background="@color/action_bar_bkgnd"
    app:theme="@style/ToolBarTheme" >

     <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Title"
        android:layout_gravity="center"
        android:id="@+id/toolbar_title"
        android:fontFamily="@font/fontFamily" />


</android.support.v7.widget.Toolbar>

1

Aynı sorunla karşılaşıyordum, bunu MainActivity'de yaparak düzeltildi

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
TextView mTitle = (TextView) toolbar.findViewById(R.id.toolbar_title);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayShowTitleEnabled(false);

Ve Parçalı

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    if (view == null) {
        // Inflate the layout for this fragment
        view = inflater.inflate(R.layout.fragment_example, container, false);
        init();
    }
    getActivity().setTitle("Choose Fragment");
    return view;
}

@Override
public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {
    inflater.inflate(R.menu.example_menu, menu);
}
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.