代码之家  ›  专栏  ›  技术社区  ›  VolodymyrH

除了一些元素外,如何通过透明视图(alpha 80%)覆盖整个屏幕?

  •  0
  • VolodymyrH  · 技术社区  · 7 年前

    . 问题是我不知道该怎么解决。我无法掩饰 工具栏 不知道怎么让我的按钮可见。 应该是这样的: screenshot

    我相信有一个简单的方法可以做到,如果有人用过,请解释。

    我试着这样做:在activity_main中。我添加的xml 通过点击按钮,我可以看到它。但它同样只覆盖选项卡标题下的区域。

      <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>
    
    2 回复  |  直到 7 年前
        1
  •  1
  •   HB. nkmuturi    7 年前

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

    <?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%,一个用于工具栏,一个用于内容,然后我设置了它的可见性 图片框 s、 这可以相应地更改。

        2
  •  0
  •   Vempati Satya Suryanarayana    7 年前

    对于覆盖整个屏幕的视图,可以设置透明背景。不管你的观点是什么 如果希望它们透明,可以设置透明背景。