Question

我点击一个按钮，所有屏幕都应该变暗，除了这个按钮。我试图改变颜色，主题，但它并没有给我我想要的东西。现在我有一个想法，通过半透明视图覆盖整个屏幕，它可以工作，但只涵盖 ToolBar 下的区域。问题是我无法弄清楚如何修复它。我无法覆盖 ToolBar ，无法想象如何让我的按钮可见。它应该是这样的：

我确信这有一个简单的方法，如果有人使用它，请解释。

我正在尝试这样做：在activity_main.xml中我添加了 View ，点击按钮我可以看到它。但它再次只涵盖了Tab标题下的区域。

  <View
    android:id="@+id/transparent_view"
    android:visibility="gone"
    android:alpha="20"
    android:background="@color/darkGrey"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
  </View>

完整布局代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
  tools:context=".activity.MainActivity">

  <View
    android:id="@+id/transparent_view"
    android:visibility="gone"
    android:alpha="20"
    android:background="@color/darkGrey"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
  </View>

  <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_main"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:layout_alignParentTop="true"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:title="Your Wi-Fi is online">

    <Button
      android:id="@+id/btn_pause"
      android:layout_width="90dp"
      android:layout_height="36dp"
      android:layout_margin="17dp"
      android:layout_gravity="end"
      android:background="@color/white"
      android:text="@string/pause"
      android:textColor="@color/midPurple"
      android:textSize="14sp" />
  </android.support.v7.widget.Toolbar>

  <android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    style="@style/AppTabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/toolbar_main"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

  <android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_below="@+id/tabs" />

</RelativeLayout>

Answer 1

这是我想到的第一件事，可能有更简单的方法，但这会有效：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
  tools:context=".activity.MainActivity">


  <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#80000000"
    android:visibility="gone"
    android:id="@+id/darkOverLay_Content"/>

  <View
    android:id="@+id/transparent_view"
    android:visibility="gone"
    android:alpha="20"
    android:background="@color/darkGrey"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >
  </View>

  <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar_main"
    android:layout_width="match_parent"
    android:layout_height="80dp"
    android:layout_alignParentTop="true"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:title="Your Wi-Fi is online">

    <Button
      android:id="@+id/btn_pause"
      android:layout_width="90dp"
      android:layout_height="36dp"
      android:layout_margin="17dp"
      android:layout_gravity="end"
      android:background="@color/white"
      android:text="@string/pause"
      android:textColor="@color/midPurple"
      android:textSize="14sp" />


    <ImageView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:background="#80000000"
      android:visibility="gone"
      android:id="@+id/darkOverLay_ToolBar"/>

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

  <android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    style="@style/AppTabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/toolbar_main"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

  <android.support.v4.view.ViewPager
    android:id="@+id/viewpager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_below="@+id/tabs" />

</RelativeLayout>

然后在您的java类中，您可以执行以下操作：

ImageView darkOverLay_Content = (ImageView) findViewById(R.id.darkOverLay_Content);
ImageView darkOverLay_ToolBar = (ImageView) findViewById(R.id. darkOverLay_ToolBar);
Button clickButton = (Button) findViewById(R.id. btn_pause);
clickButton.setOnClickListener( new OnClickListener() {

    @Override
    public void onClick(View v) {
        // TODO Auto-generated method stub
        ***Do what you want with the click here***
        if(darkOverLay_Content.getVisibility()==View.VISIBLE) {

            darkOverLay_Content.setVisibility(View.GONE);
            darkOverLay_ToolBar.setVisibility(View.GONE);
        }else{

            darkOverLay_Content.setVisibility(View.VISIBLE);
            darkOverLay_ToolBar.setVisibility(View.VISIBLE);

        }
    }
}});

在这个答案中，我使用2 ImageView s，80％透明度，一个用于toolBar，一个用于内容，然后我设置了这个ImageView的可见性。这可以相应地改变。

希望这有帮助，请告诉我。

Answer 2

对于覆盖整个屏幕的视图，您可以设置透明背景。无论以上是什么观点如果希望透明背景透明，可以设置透明背景。

如何通过透明视图覆盖整个屏幕（alpha 80％），除了一些元素？

2 个答案: