`VideoView.start()` cause other views to break - android-layout

When my activity receives a new intent via onNewIntent, it updates the data of three Views, an ImageView, a TextView, and a VideoView. The problem is, the two other views just flash, then disappear when my VideoView comes on. After scattering a few breakpoints, I discovered that they appear when their content is set, but disappear when VideoView.onStart() is called in my MediaPlayer.onPrepared() method. I also have an AlertDialog show up when the menu button is pressed. After pressing the menu button, it shows up. I'm on Android API 9, as this is the API on the device I'm working on. I really need help, so I'd appreciate any advice.
Here's the layout. I don't think it's the issue though:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:keepScreenOn="true" >
<TextView
android:id="#+id/marquee"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:ellipsize="marquee"
android:focusable="false"
android:marqueeRepeatLimit="marquee_forever"
android:scrollHorizontally="true"
android:singleLine="true"
android:textAppearance="#android:style/TextAppearance.Large"
android:textColor="#android:color/white" >
</TextView>
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_above="#id/marquee"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_gravity="center_vertical" />
<VideoView
android:id="#+id/video"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/marquee"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_alignWithParentIfMissing="true"
android:layout_toLeftOf="#+id/image" />
</RelativeLayout>
Take note that the TextView is meant to be a marquee; it's supposed to keep scrolling sideways, until it is disposed of. I discovered that when the text is too short for it to start the marquee, the TextView AND the ImageView disappear (as stated earlier, they appear for a split second, then disappear). However, when the text causes the marquee feature to activate, everything works.
CURRENTLY:
I got it to work by calling postInvalidateDelayed(500) on my ImageView and TextView after calling VideoView.start(). I think the start() method is causing the problem, and requires that other views call invalidate(). Also, for some reason, there needs to be a small delay in-between the call to start() and the call to invalidate().

The layout is the issue.
Your VideoView is declared as match_parent, match_parent, allowing it to consume the whole width and height of the screen. Since you declared it last on the xml file (You used RelativeLayout. Ordering matters), the TextView and the ImageView would be covered by the VideoView.
If you're confused,
match_parent is basically the same as fill_parent. It's just another name for fill_parent in android 2.3+
Now what can you do about it?
Reorder your views in such a way that the largest is declared first. In this case, VideoView, then ImageView, then TextView.
Also note that your ImageView has height set to fill_parent - you may not want that.

I created a method, but it seems very bad:
private void startVideo() {
this.videoView.start();
if (this.imageView != null)
this.imageView.postInvalidateDelay(500);
if (this.textView != null)
this.textView.postInvalidateDelay(500);
}
It works, but it makes me feel dirty.

Related

How to add constrainlayout only to floating actio button?

I want to add constrainlayout only two the last two floating action button with nested framelayout. any help would be highly appreciated. My main idea is to able to move and position the floating action button from graphical user interface.
I have notice that android gravity help to put button at right and the center from right with
android:layout_gravity="right|center"
how can i add a button at right but between center and end at bottom.
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#000000"
tools:context=".MediaPresentationActivity"
android:id="#+id/FrameLayout">
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<VideoView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/videoViewPresentation"
android:layout_gravity="center" />
<ImageView
android:id="#+id/imageViewPresentation"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_gravity="left|top"
android:background="#ffffff"
android:src="#drawable/serv24logobig" />
</FrameLayout>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
</LinearLayout>
</LinearLayout>
//*how to add only below two floating action button as constrainlayout //
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="right|center"
android:src="#android:drawable/stat_sys_phone_call"
android:visibility="visible"
app:backgroundTint="#android:color/holo_red_dark"
app:elevation="12dp"
app:rippleColor="?android:attr/colorActivatedHighlight" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="right|center"
android:src="#android:drawable/stat_sys_phone_call"
android:visibility="visible"
app:backgroundTint="?android:attr/colorMultiSelectHighlight"
app:elevation="12dp"
app:rippleColor="?android:attr/colorActivatedHighlight" />
</FrameLayout>
FrameLayouts only allow ONE child (well they allow N children, but they overlap, because it doesn't support children positioning, rather it expects them to take all the available space), so if you want to use a ConstraintLayout to position two items inside a FrameLayout, then you need to ensure that the children of your FrameLayout, is a ViewGroup that allows positioning of its own children.
Let's see what you got.
Your Root is a FrameLayout, perhaps you should consider making it a ConstraintLayout to begin with...
You're asking your Root layout to wrap its contents. Unless this is a custom view, this is somewhat frowning, but not wrong; since I don't know how you're using this, it's hard to tell if this is the correct approach in this case.
I don't know how your UI should look, but from what I see, you have a series of nested LinearLayouts, Vertical, then Horizontal to have an ImageView and a VideoView... not sure how you expect these to be positioned.
Down Below you have an empty LinearLayout... (?)
and then you tossed the two FABs.
This is not going to work. I suggest you revisit your entire Layout (which, btw, is incorrect as pasted, because you're closing the FrameLayout twice...).
If you post an image of what your desired output is, perhaps we can help you better understand where your problem is. As it is, it's not possible to determine.
The answer to your question, as written at this time is:
"How can I add a constraint Layout onlo to the last two FABs?"
You can't (for the purposes I think you want), but if you really want to see why, and what would happen:
Simply add, inside your FrameLayout this:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<!-- YOUR FABS GO HERE -->
</androidx.constraintlayout.widget.ConstraintLayout>
This will obviously NOT LOOK THE WAY YOU WANT, but that's why I asked you in the comment above, "show us what you want, we need a minimal reproducible example of what you need".
There was a reason why I asked that, not to annoy you, but to help you. You chose to ignore it, and that's as far as I can go to help you with the information I have.

Drawer Layout in fragment

I tried to implement a Drawer Layout in a fragment, however, if I use "android: layout_gravity="start" then my navigational just disappears.The same code works fine if I put it in an activity.
And if I try to swipe to the right, it also does not work (you can see it in the image I posted). For me, it looks like I can not swipe to the right and therefor the navigation view can not be opened?
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="200dp"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.design.widget.NavigationView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
app:menu="#menu/bottom_navigation">
/>
</android.support.v4.widget.DrawerLayout>
Image (if I swipe to the right
By looking at this gist, you should add android:fitsSystemWindows="true" to the DrawerLayout and set its width to match_parent. My guess is, it should be the child NavigationView which can have a defined width.

Is there a good way to make a button in Android do different things depending on if you click on the left half or right half of the button?

In an android app I am making, I would like to make a button that does different things depending on whether the user presses the left half of the button or the right half of the button. Right now I'm trying to figure out what would be the best way to accomplish this.
Some other specific requirements:
1. I'm planning on using the button 1 to 4 times per Activity.
2. It would be very helpful if I could be able to rotate the button (e.g. 90 degrees, 180 degrees so it's upside-down)
One idea I have had is putting two buttons side by side and putting a text-view on the top to make it look like one button. I found this doesn't really work well. It requires lots of effort to get it to show up properly and gets messed up when even small changes are made.
Another idea I had was making a custom button by extending the view class. Problem is I have no experience doing something like that and most of the tutorials I've seen use it to make paint programs.
What would be the best way to create something like this??
Edit: When I say rotate the button, I don't mean that the button needs to rotate when clicked or when some other action is performed. Just that it is facing in the direction I need it to be when the app loads. Also it only needs to be facing in the standard 4 directions (i.e. Down, Up, Left, Right). Sorry I wasn't more clear on that.
i created the first approach using framelayout as follow:
<FrameLayout
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="70dp"
android:onClick="rotate">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
app:layout_constraintBottom_toTopOf="#+id/view"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/imageView2">
<Button
android:id="#+id/button"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/colorPrimary" />
<Button
android:id="#+id/button2"
style="#style/Widget.AppCompat.Button.Borderless"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#color/colorAccent" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:text="Button text"
android:textAppearance="#style/TextAppearance.AppCompat.Display1"
android:textColor="#android:color/white" />
</FrameLayout>
for rotating any view create your anim.xml file inside anim folder in res
right click on res -> new android res dir-> choose anim then create anim file right click on anim folder you just created and new anim res file and the past the code in side it , this will rotate your framelayout in this certain code by 180 degeree
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<rotate
android:duration="500"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="180" />
</set>
use it as follow on kotlin
fun rotate(view: View) {
val rotate = AnimationUtils.loadAnimation(
applicationContext,
R.anim.rotate
)
frame.startAnimation(rotate)
}

Android clickable layouts above empty views

My project also uses Xamarin with MvvmCross, but I don't think this will effect the answer since the problem is all view-layout/axml related.
I have a GridView that summarizes a list of contacts. When clicking on this grid view, I would like the user to be taken to another screen to add more contacts to this list (so there is more space).
Subscribing to the GridView's OnClick event gives me an exception, saying I should be subscribing to the item click event, so I have done this using a clickable relative layout that surrounds the GridView (and its accompanying empty image view) as such:
...
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/addContactsRelativeLayout"
android:clickable="true">
<ImageView
android:id="#+id/empty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/ic_add" />
<Mvx.MvxGridView
android:id="#+id/addContactsGridView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
local:MvxBind="ItemsSource Contacts"
local:MvxItemTemplate="#layout/contact_summary_item"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:columnWidth="55dip"
android:gravity="center" />
</RelativeLayout>
...
This works fine when the GridView is empty, and the empty ImageView is shown. However, when there are items in the GridView, the RelativeLayout no longer seems to exist and clicks over the GridView can be seen to highlight items on the GridView. This means the user is not taken to the screen to edit their contact list.
I have tried several different configurations and attributes from similar questions on SO, but I think the addition of an empty view is causing problems. Any help would be greatly appreciated.
Ok, after a lot more playing around I found a solution.
Essentially it's adding another relative layout, higher in the z-index and therefore above the 'real' contents, within the surrounding relative layout.
...
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="match_parent">
<ImageView
android:id="#+id/empty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="#drawable/ic_add" />
<Mvx.MvxGridView
android:id="#+id/addContactsGridView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
local:MvxBind="ItemsSource Contacts"
local:MvxItemTemplate="#layout/contact_summary_item"
android:numColumns="auto_fit"
android:stretchMode="columnWidth"
android:columnWidth="55dip"
android:gravity="center"
android:focusable="false"/>
<RelativeLayout
android:layout_height="match_parent"
android:layout_width="match_parent"
android:clickable="true"
android:id="#+id/addContactsRelativeLayout"/>
...
Then just move all your click listeners to listen to the relative layout at the bottom.

Android: SlidingDrawer with bottomOffset and content visible

I have been experiencing some issue with the SlidingDrawer in Android. I am building a screen with a horizontal sliding drawer. It is working fine, it is opening and closing as expected. I have set a bottomOffset as 50dip in order to see 50dpi of the content when the drawer is closed, but this is not happening.
When the drawer is closed, I am seeing the 50dip distance between the right side of the screen to the handle, but then the content view gets invisible so there is a 50dip black space between the handle and the screen edge, as the image below shows:
When I press the handle button, it seems that the content gets its visibility changed to visible, and then it appers. I would like to keep the content visible without having to press the handle, like in the imagem below:
I downloaded the SlidingDrawer source code from http://blog.sephiroth.it/2011/03/29/widget-slidingdrawer-top-to-bottom/ in order to try to change the code and get the expected result, but I am not getting.
The XML for the sliding drawer:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<br.com.dina.partial.example.MultiDirectionSlidingDrawer
xmlns:my="http://schemas.android.com/apk/res/br.com.dina.partial.example"
android:id="#+id/map_slider"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true"
my:handle="#+id/Handle"
my:content="#+id/ViewLayout"
my:direction="rightToLeft"
my:bottomOffset="-65dip"
android:layout_below="#+id/test">
<Button android:id="#+id/Handle" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="handle"/>
<LinearLayout android:id="#+id/ViewLayout"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<com.markupartist.android.widget.ActionBar
android:id="#+id/actionbar"
style="#style/ActionBar"/>
<FrameLayout android:id="#+id/ViewContent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/white" />
</LinearLayout>
</br.com.dina.partial.example.MultiDirectionSlidingDrawer>
</RelativeLayout>
Is there a way to achieve what I want?
Many thanks
edited to add the xml
Use the onDrawerScrollListener, onDrawerOpenListener, and onDrawerCloseListener to change the visibility of certain items depending on the state of the drawer. So when you say "the drawer is closed...and the content view is invisible" then in your onDrawerCloseListener set the content view to VISIBLE. Give this a try and let me know how it goes.
EDIT so you did something like this?:
drawer.setOnDrawerCloseListener(new OnDrawerCloseListener(){
#Override
public void onDrawerClosed() {
//get the ViewContent by id and set visibility to VISIBLE
});

Resources