在Android中从顶部到底部到状态栏和工具栏创建线性渐变 [英] Create Linear gradient from top to bottom to status bar and toolbar in android
问题描述
我想向状态栏和工具栏添加线性渐变颜色.我可以向状态栏和工具栏添加0度角度的渐变，该渐变显示从左到右的渐变颜色(左侧为粉红色，右侧为紫色).但是我想要90度角的梯度流，它是从顶部到底部或从底部到顶部的(例如:顶部粉红色和底部紫色).栏和工具栏是分开的，我希望状态栏和工具栏都具有相同的渐变颜色，且渐变角度为90度
I want to add a Linear gradient color to Status Bar and Toolbar.
I am able to add gradient to status bar and toolbar with angle of 0 degree which shows left to right gradient color (pink on left and purple on right).
But I want the gradient flow with angle of 90 degree which is top to bottom or bottom to top (eg: top pink and bottom purple).I tried but I ended up with this and this.Here status bar and toolbar is being separated, I want both status bar and toolbar to have same gradient color with angle of gradient 90 degree
推荐答案
在KitKat和更高版本上，您可以通过将状态栏设置为半透明并使用带有稀松布的全屏布局来控制状态栏和操作栏背景.注意将渐变从状态栏混合到操作栏.
On KitKat and later you can control the status bar and action bar backgrounds by setting the status bar as translucent and using a full-screen layout with a scrim, while taking care to blend gradients from status bar into action bar.
一个警告是，KitKat在我们自己的基础上使用了自己的渐变稀松布，似乎无法覆盖，但是在Lollipop +上则没有这样的问题.
One caveat is that KitKat uses its own gradient scrim on top of our own and that doesn't appear to be possible to override, but on Lollipop+ there is no such problem.
以下是MarshMallow模拟器上的工作活动示例:
Here is an example of the working activity on a MarshMallow emulator:
这是我使用的代码:
res/values/styles.xml:
res/values/styles.xml:
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
<item name="actionBarStyle">@style/MyActionBar</item>
</style>
<style name="MyActionBar" parent="@style/Widget.AppCompat.ActionBar">
<item name="background">@drawable/actionbar_bg</item>
</style>
<style name="AppTheme.ActionBar.Popup" parent="ThemeOverlay.AppCompat">
<item name="android:colorBackground">@color/colorPrimaryDark</item>
<item name="background">@color/colorPrimaryDark</item>
</style>
res/values/colors.xml:
res/values/colors.xml:
<resources>
<color name="colorPrimary">#ff7000e0</color>
<color name="colorPrimaryDark">#ff400080</color>
<color name="colorAccent">#ff40aba0</color>
</resources>
res/drawable/statusbar_bg.xml:
res/drawable/statusbar_bg.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:angle="270"
android:endColor="#ff7000e0"
android:startColor="#ff8000ff" />
</shape>
res/drawable/actionbar_bg.xml:
res/drawable/actionbar_bg.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient
android:startColor="#ff7000e0"
android:endColor="#ff400080"
android:angle="270" />
</shape>
res/layout/activity_main.xml:
res/layout/activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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="match_parent"
android:orientation="vertical"
android:fitsSystemWindows="false" >
<View
android:id="@+id/main_activityStatusBarScrim"
android:layout_width="match_parent"
android:layout_height="26dp"
android:background="@drawable/statusbar_bg"/>
<android.support.v7.widget.Toolbar
android:id="@+id/main_activityToolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:background="@drawable/actionbar_bg"
app:popupTheme="@style/AppTheme.ActionBar.Popup"/>
<FrameLayout
android:id="@+id/main_activityFragmentContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:background="#ffffffff">
</FrameLayout>
</LinearLayout>
MainActivity.java:
MainActivity.java:
public class MainActivity extends AppCompatActivity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// make the main layout fill the screen
Window window = getWindow();
final int layoutFlags = View.SYSTEM_UI_FLAG_LAYOUT_STABLE
| View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN;
window.getDecorView().setSystemUiVisibility(layoutFlags);
supportRequestWindowFeature(Window.FEATURE_ACTION_BAR_OVERLAY);
// make the status bar translucent
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.setStatusBarColor(0x00000000);
} else if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
// N.B. on some (most?) KitKat devices the status bar has a pre-defined gradient that
// cannot be overridden.
window.addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
}
// inflate main layout and set up action bar
setContentView(R.layout.activity_main);
Toolbar toolbar = findViewById(R.id.main_activityToolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
}
// set the height of the scrim to standard status bar height for this device (normally 26dp)
View statusBarScrim = findViewById(R.id.main_activityStatusBarScrim);
int height;
int resourceId = getResources().getIdentifier("status_bar_height", "dimen", "android");
if (resourceId > 0) {
height = getResources().getDimensionPixelSize(resourceId);
} else {
// belt and braces
height = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 26f, getResources().getDisplayMetrics());
}
if (statusBarScrim != null) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
ViewGroup.LayoutParams lp = statusBarScrim.getLayoutParams();
lp.height = height;
statusBarScrim.setLayoutParams(lp);
statusBarScrim.setVisibility(View.VISIBLE);
}
}
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
...
这篇关于在Android中从顶部到底部到状态栏和工具栏创建线性渐变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
