Mixing
How to remove shadow from Appbar and add shadow to the TabLayout
1
I have the following simple app with 3 tabs:
I want to remove the shadow from the appbar and add shadow to the tablayout.
I tried multiple things such as android:elevation or adding <item name="elevation">0dp</item> to the AppTheme, or using <item name="android:windowContentOverlay">@null</item>. Nothing works. I keep having a shadow under the app bar (where is says My App) and no shadow is added under
the tabs (Where is says PAGE 1, PAGE2, PAGE3).
These are my xml files:
style.xml:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="elevation">0dp</item>
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<!-- Style for a tab that displays a category name -->
<style name="CategoryTab" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">@android:color/white</item>
<item name="tabSelectedTextColor">@android:color/holo_purple</item>
<item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
</style>
<!-- Text appearance style for a category tab -->
<style name="CategoryTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textColor">#000000</item>
</style>
</resources>
this is the activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/primary_color"
android:orientation="vertical"
tools:context="com.example.barebones.barebones.MainActivity">
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
style="@style/CategoryTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="15dp"/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="10dp"/>
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
android asked Nov 19 '18 at 12:23
Fireio
527
add a comment |
1
I have the following simple app with 3 tabs:
I want to remove the shadow from the appbar and add shadow to the tablayout.
I tried multiple things such as android:elevation or adding <item name="elevation">0dp</item> to the AppTheme, or using <item name="android:windowContentOverlay">@null</item>. Nothing works. I keep having a shadow under the app bar (where is says My App) and no shadow is added under
the tabs (Where is says PAGE 1, PAGE2, PAGE3).
These are my xml files:
style.xml:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="elevation">0dp</item>
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<!-- Style for a tab that displays a category name -->
<style name="CategoryTab" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">@android:color/white</item>
<item name="tabSelectedTextColor">@android:color/holo_purple</item>
<item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
</style>
<!-- Text appearance style for a category tab -->
<style name="CategoryTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textColor">#000000</item>
</style>
</resources>
this is the activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/primary_color"
android:orientation="vertical"
tools:context="com.example.barebones.barebones.MainActivity">
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
style="@style/CategoryTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="15dp"/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="10dp"/>
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
asked Nov 19 '18 at 12:23
Fireio
527
add a comment |
1
1
1
I have the following simple app with 3 tabs:
I want to remove the shadow from the appbar and add shadow to the tablayout.
I tried multiple things such as android:elevation or adding <item name="elevation">0dp</item> to the AppTheme, or using <item name="android:windowContentOverlay">@null</item>. Nothing works. I keep having a shadow under the app bar (where is says My App) and no shadow is added under
the tabs (Where is says PAGE 1, PAGE2, PAGE3).
These are my xml files:
style.xml:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="elevation">0dp</item>
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<!-- Style for a tab that displays a category name -->
<style name="CategoryTab" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">@android:color/white</item>
<item name="tabSelectedTextColor">@android:color/holo_purple</item>
<item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
</style>
<!-- Text appearance style for a category tab -->
<style name="CategoryTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textColor">#000000</item>
</style>
</resources>
this is the activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/primary_color"
android:orientation="vertical"
tools:context="com.example.barebones.barebones.MainActivity">
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
style="@style/CategoryTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="15dp"/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="10dp"/>
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
asked Nov 19 '18 at 12:23
Fireio
527
I have the following simple app with 3 tabs:
I want to remove the shadow from the appbar and add shadow to the tablayout.
I tried multiple things such as android:elevation or adding <item name="elevation">0dp</item> to the AppTheme, or using <item name="android:windowContentOverlay">@null</item>. Nothing works. I keep having a shadow under the app bar (where is says My App) and no shadow is added under
the tabs (Where is says PAGE 1, PAGE2, PAGE3).
These are my xml files:
style.xml:
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Base.Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="elevation">0dp</item>
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<!-- Style for a tab that displays a category name -->
<style name="CategoryTab" parent="Widget.Design.TabLayout">
<item name="tabIndicatorColor">@android:color/white</item>
<item name="tabSelectedTextColor">@android:color/holo_purple</item>
<item name="tabTextAppearance">@style/CategoryTabTextAppearance</item>
</style>
<!-- Text appearance style for a category tab -->
<style name="CategoryTabTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textColor">#000000</item>
</style>
</resources>
this is the activity_main.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/primary_color"
android:orientation="vertical"
tools:context="com.example.barebones.barebones.MainActivity">
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
style="@style/CategoryTab"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="15dp"/>
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="10dp"/>
<TextView
android:id="@+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextView" />
</LinearLayout>
asked Nov 19 '18 at 12:23
Fireio
527
asked Nov 19 '18 at 12:23
Fireio
527
asked Nov 19 '18 at 12:23
Fireio
527
asked Nov 19 '18 at 12:23
Fireio
527
asked Nov 19 '18 at 12:23
Fireio
527
527
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
1
add Elevation in AppBarLayout like below
getSupportActionBar().setElevation(0);
Adding shadow to your tablayout just add elevation to your Tablayout. and also for info read
Material-Design.
android:background="?attr/colorPrimary"
android:elevation="15dp"
answered Nov 19 '18 at 12:26
vikas singh
962420
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean inAppBarLayout? I simply wrote it in my main activity inside theonCreate
– Fireio
Nov 19 '18 at 12:31
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53374560%2fhow-to-remove-shadow-from-appbar-and-add-shadow-to-the-tablayout%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
add Elevation in AppBarLayout like below
getSupportActionBar().setElevation(0);
Adding shadow to your tablayout just add elevation to your Tablayout. and also for info read
Material-Design.
android:background="?attr/colorPrimary"
android:elevation="15dp"
answered Nov 19 '18 at 12:26
vikas singh
962420
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean inAppBarLayout? I simply wrote it in my main activity inside theonCreate
– Fireio
Nov 19 '18 at 12:31
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
add a comment |
1
add Elevation in AppBarLayout like below
getSupportActionBar().setElevation(0);
Adding shadow to your tablayout just add elevation to your Tablayout. and also for info read
Material-Design.
android:background="?attr/colorPrimary"
android:elevation="15dp"
answered Nov 19 '18 at 12:26
vikas singh
962420
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean inAppBarLayout? I simply wrote it in my main activity inside theonCreate
– Fireio
Nov 19 '18 at 12:31
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
add a comment |
1
1
1
add Elevation in AppBarLayout like below
getSupportActionBar().setElevation(0);
Adding shadow to your tablayout just add elevation to your Tablayout. and also for info read
Material-Design.
android:background="?attr/colorPrimary"
android:elevation="15dp"
answered Nov 19 '18 at 12:26
vikas singh
962420
add Elevation in AppBarLayout like below
getSupportActionBar().setElevation(0);
Adding shadow to your tablayout just add elevation to your Tablayout. and also for info read
Material-Design.
android:background="?attr/colorPrimary"
android:elevation="15dp"
answered Nov 19 '18 at 12:26
vikas singh
962420
edited Nov 20 '18 at 5:19
answered Nov 19 '18 at 12:26
vikas singh
962420
answered Nov 19 '18 at 12:26
vikas singh
962420
answered Nov 19 '18 at 12:26
vikas singh
962420
962420
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean inAppBarLayout? I simply wrote it in my main activity inside theonCreate
– Fireio
Nov 19 '18 at 12:31
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
add a comment |
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean inAppBarLayout? I simply wrote it in my main activity inside theonCreate
– Fireio
Nov 19 '18 at 12:31
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean in
AppBarLayout? I simply wrote it in my main activity inside the onCreate– Fireio
Nov 19 '18 at 12:31
Thanks, this removed the shadow, but what about adding the shadow to the Tabs? nothing worked. Btw, what do you mean in
AppBarLayout? I simply wrote it in my main activity inside the onCreate– Fireio
Nov 19 '18 at 12:31
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
hi @Fireio sorry for late reply...Please check the answer.
– vikas singh
Nov 20 '18 at 5:21
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53374560%2fhow-to-remove-shadow-from-appbar-and-add-shadow-to-the-tablayout%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
