Change color to my tabbedPage in xamarin forms

Question

Change color to my tabbedPage in xamarin forms

Navigation

#1 by (1 votes)
#2 by (0 votes)
#3 by (0 votes)
#4 by (0 votes)

0

Someone knows how I can change the color of my tabbedPage in Xamarin forms, I want it to have the same color of the Navigation Bar that I have. The following image is an example of how I want it, just need to change the color of the Tabbed Page.

android c# xamarin

asked by Juan Lopez 02.04.2016 в 13:47

source

4 answers

High dynamic adjustment of a vLayout How to make a foreign key in SQlite.net from c #

score 1 · Answer 1

Solution

All you need to do is change the color code of the colorPrimary attribute located in the styles.xml of your Android project (Resources> values).

<item name="colorPrimary">#TU_CODIGO_HEX</item>

Explanation

By default, both the navigation bar and the tabs bar on Android, take as background color the colorPrimary defined in your file styles.xml . The files Tabbar.axml and Toolbar.axml , located in Resources > layout, they have their property android:background linked to that color. Check that they have this:

android:background="?attr/colorPrimary"

And those are the layouts that Xamarin.Forms takes to render those controls. Look at the MainActivity.cs that you have 2 lines like this:

TabLayoutResource = Resource.Layout.Tabbar;
ToolbarResource = Resource.Layout.Toolbar;

score 0 · Answer 2

You have two options, the first is to use a custom render where you basically take the class base (in this case TabbedPage ) and modify the property you need.

The other option you have (only for android) is to use themes, in the forums of xamarin you can take as a base the next code

In the Xamarin blog , James Montemagno has exactly the style to modify the style of the tabs in android for Xamarin forms

score 0 · Answer 3

Example:

  <TabbedPage //todo lo demás 
BarBackgroundColor="{StaticResource ColorAzul}" 
    BarTextColor="{StaticResource ColorBlanco}" >

BarBackgroundColor and BarTextColor are properties of TabbedPage, with the first you can change the color of the tab and with the second the text of the tabs.

In the App.xaml

   <Application>
   <Application.Resources>
    <ResourceDictionary>

    //aqui meteras todo lo que se refiere a color, estilo y demás...
    //es de gran ayuda ya que te ayuda a tener todo de una manera más organizada
    <!-- Colores-->
    <Color x:Key="ColorAzul">#2196F3</Color>
    <Color x:Key="ColorBlanco">#FFFFFF</Color>

  </ResourceDictionary>
    </Application.Resources>
    </Application>

score 0 · Answer 4

okay I understand you.

        BarBackgroundColor="Aqui pornes el color que quieras. "

This is the property to change the bar color of a tabbedPage.

you use it from the head. from the taggedPage ..

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
            xmlns:pages="clr-namespace:App.Views;assembly=App"
            x:Class="App.Views.Test"
            Title="TestBar"            
            BarBackgroundColor="White"
            BarTextColor="#339966">

</TabbedPage>