I'm trying to show a SurfaceView inside an Activity that has a theme that extends Theme.Dialog (you can think as I'm trying to show it inside a Dialog class), but I'm having some layout glitch.
I couldn't make a picture because the glitch vanish when taking a screenshot :/ but anyway what you see is that the "hole" of SurfaceView is moved from its original position and it create some weird overlay effect...
The problem seems to be related with the flag windowIsFloating, if I set it to false the glitch goes away...
Any idea for a possible workaround to keep using windowIsFloating flag?
Simple layout to reproduce the issue:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#fff">
<FrameLayout android:id="#+id/container"
android:layout_width="250dp"
android:layout_height="250dp"
android:layout_centerInParent="true"
android:padding="30dp"
android:background="#ff0">
<SurfaceView android:id="#+id/surface"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
and modify your activity's theme like this to reproduce the issue:
<style name="MyTheme" parent="#android:style/Theme">
<item name="android:windowIsFloating">true</item>
</style>
It seems like there is no way to solve the glitch, simply windowIsFloating flag is very buggy with SurfaceView...
So, following also the answer here How to create a transparent activity WITHOUT windowIsFloating, I ended up by creating a theme that extends Dialog's theme but set windowIsFloating flag to false and windowIsTranslucent to true.
That way you need manually to create a layout that behave like a Dialog, but you don't have any glitch and your background can be fully transparent :)
Symple example of a theme that will do the trick:
<style name="MyTheme" parent="#android:style/Theme">
<item name="android:windowIsFloating">false</item>
<item name="android:windowIsTranslucent">true</item>
</style>
Then you need to apply margins to your layout, otherwise it will be fullscreen as a normal Activity.
I share this because it may be useful to others. I've run into a transparency issue with a SurfaceView inside a dialog and the following answer helped me resolve it (and I did not have to use windowIsFloating=false as suggested here although it also does the trick):
https://stackoverflow.com/a/7061396/875442
As it turned out my problem was both a Z-ordering and a transparency issue.
Related
I've tried everything I can to achieve this feature but failed, "drawerLayout.setStatusBarBackground()" doesn't work, "android:windowTranslucentStatus:true" doen't work.
Here, first image is all I can do now, and the second one is the desired effect:
All I can do now
Desired effect
Thank you so much.
Problem is that NavigationView extends ScrimInsetsFrameLayout which listens window insets changes and adds dim line to the layout.
The sameScrimInsetsFrameLayout has styleable property insetForeground at least in com.google.android.material:material:1.1.0-alpha07
so if you use:
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:windowTranslucentStatus">true</item>
<item name="android:statusBarColor">#color/transparent</item>
You only need to set that insetForeground to #color/transparent
For example:
<com.google.android.material.navigation.NavigationView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:insetForeground="#color/transparent"/>
Warning:
This will not work if you set android:fitsSystemWindows="true".
Caution:
Using this approach means that you have to manage your insets manually since you are using translucent status and not fitting system windws.
When I open the overflow menu in my application, I see a solid rectangle of the menu background color displayed behind the menu itself throughout the enter/exit animations. Here's an animation showing this (slowed to 75% speed):
The presence of this extraneous colored rectangle spoils the nice enter/exit animations! How can I remove it while retaining all other Toolbar styling?
Research
I've read a bunch of answers on Toolbar styling on SO, and Chris Banes' own posts on the subject. It seems that usage of the style/theme tags on a per-View basis has changed in the past couple years, which has made it difficult to find definitive information anywhere.
I've reproduced this using versions 22.1.0 through 23.2.0 (inclusive) of the support library.
App files
styles.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="ToolbarStyle" parent="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:background">#color/colorPrimary</item>
</style>
</resources>
activity_main.xml
<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.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:style="#style/ToolbarStyle" />
<fragment
android:id="#+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Runtime View Analysis
As #Commonsware suggested, I took a look at the view hierarchy at run time. Editing in the results:
Menu collapsed (overflow button present, no mysterious extra rectangle):
Menu expanded (overflow menu views displayed in separate Window):
The main application view hierarchy (as displayed in the original Window) is unchanged when comparing the two menu (steady) states. My guess is therefore that the extra rectangle is temporarily added to the main application's window during menu animations, and immediately removed upon their completion. I'm not sure why this would be done - perhaps it's a hangover from an older (and now unused) method of showing and hiding the overflow menu? If my deduction is correct, then this question could be resolved if we can determine how to prevent this transitory behavior...
An extract from the Chris Bane's answer to the question AppCompat style background propagated to the Image within the ToolBar
style = local to the Toolbar
theme = global to everything inflated in the Toolbar
Based on the above post it seems, the android:background attribute you are setting in the android:theme is the reason for the extra background color during the animation.
I'd set the background to the toolbar directly and used the android:colorBackground attribute to set the background color for the popup. The animation seems to work fine.
Code:
activity_main.xml
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:theme="#style/CustomToolbarTheme" />
styles.xml
<style name="CustomToolbarTheme" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:colorBackground">#color/colorPrimary</item>
<item name="android:textColorPrimary">#android:color/white</item>
</style>
I'm having trouble implementing a Toolbar in my Android application. I have several problems, really.
First off, here's my MainActivity.java:
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar)findViewById(R.id.toolbar_Main);
toolbar.setLogo(R.drawable.logo);
toolbar.setTitle(R.string.app_name);
toolbar.inflateMenu(R.menu.main_actions);
setActionBar(toolbar);
}
}
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:orientation="vertical"
tools:context=".MainActivity"
android:nestedScrollingEnabled="false">
<Toolbar
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:id="#+id/toolbar_Main"
android:background="?android:attr/colorPrimary" />
<!-- There's an EditText here, but I think that's not the problem -->
</LinearLayout>
styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="android:Theme.Material.Light">
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionBar">false</item>
<item name="android:colorPrimary">#color/primaryColor</item>
<item name="android:colorPrimaryDark">#color/primaryColorDark</item>
</style>
</resources>
The problems I'm having are:
the menu is gone;
the logo and title text are centered in the Toolbar, even though I'm pretty sure I haven't set any property to center or whatever.
Now the first problem I can fix by removing the setActionBar part (not sure if that's good practice though), but second one, not so much. The logo and text remain centered no matter what I try. I've tried setting the Toolbar's gravity to top|left, as well as some other things, all to no avail.
When searching on Google (or StackOverflow), all I get are results asking to center the text, which is what I don't want.
I should also mention that I'm developing the app only for API level 21, so no AppCompat and all that fancy stuff, just a Toolbar that I wish to use as the app's main ActionBar.
I'm probably just missing some tiny thing, so thanks in advance.
To me:
You should not remove the setActionBar() call;
Your menu might be disappearing because maybe you have a hardware menu button on your device. Try tapping and see what happens. To fix however, try deleting the inflateMenu() line and inflate the menu during onCreateOptionsMenu(), as usual;
Title and logo issues, as well as menu disappearing, might be due to:
<item name="android:windowNoTitle">true</item>
<item name="android:windowActionBar">false</item>
Why these lines? Just remove them if you don't need.
If this doesn't fix, try calling setActionBar(toolbar) first, and then set title using getActionBar().setTitle() . However I'm pretty sure that removing the two window lines from your style will be enough, so do that first.
I am using actionbar sherlock and it works very well. The only problem I have is to figure out how to set the background image for the area which is used by the activities. All I end up with is setting a background image for the actionbar itself.
Any suggestion highly appreciated
martin
The windowBackground attribute is perfect for this.
<style name="MyTheme" parent="Theme.Sherlock">
<item name="android:windowBackground">here!</item>
</style>
Just set the background for your main layout in your activity.
Eg. in your layout file:
<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:orientation="vertical"
android:background="#drawable/myImage" >
just write following line of code in your onCreate().
getSupportActionBar().setIcon(R.drawable.your_image);
I am creating a small game for Android. At the moment I'm just creating the UI for the menu screen.
As I'm doing a wooden theme, I also want to use a custom dialog for showing highscores etc so it follows the theme.
I have found some good guides, but I have this very strange problem with the background of the dialog. The dialog is almost transparent.
What I have done:
- created a dialog_theme.xml with:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Dialog" parent="android:Theme">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#color/transparent</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:backgroundDimEnabled">false</item>
</style>
</resources>
created custom_dialog.xml with the elements I need (TextView for title and content, and button to close)
created a CustomDialog class which extends Dialog, and lets me build these custom dialogs rather easy with the content and title I want
using the CustomDialog in the activity to create the dialog
(the main guide I used for this blog.androgames.net/10/custom-android-dialog/ )
The problem is that the transparent background isn't always transparent (showing the activity ui in the background). I have 4 custom buttons in this menu. Problem is that instead of just showing the dialog transparent and showing the whole ui in the background, then one of the images for a button is stretched and fills the whole dialog background. If I just use a standard background for this one button then the dialog background is transparent and shows the activity ui in the background as it should.
As I might have been bad at explaining I will show pictures of what I mean:
- Code for the button that causes the problem:
<Button
android:id="#+id/id_about_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/id_achievements_button"
android:layout_marginTop="15dp"
android:background="#drawable/selector_about" />
Gives this result: (sorry but I can't use pictures directly in the post yet)
http://dl.dropbox.com/u/2980431/wrong.png
Modifying the button code to:
<Button
android:id="#+id/id_about_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#+id/id_achievements_button"
android:layout_marginTop="15dp"/>
Gives this result:
http://dl.dropbox.com/u/2980431/correct.png
Hope someone got an idea about why this is happening, and a solution to fix it - to be honest I am totally lost.
Still not sure what happened. In another project I came across the same thing - custom semi transparent dialog background, got another drawable added to the background. Renaming the wrong drawable showing in the background, and then clean the project fixed this for me.
Strange.