Layout snaps to visible (first time only) instead of slide animation - android-layout

I'm creating a 2 row info bar in the bottom of the screen.
At first only the top row will be visible.
Press an 'expand' button, the 2nd row will slide up from
below. Now both the rows are visible.
Pressing same button again, the bottom row slides down, and
only the 1st row is visible.
This scenario is very common, and after checking different implementations, I've come to this simple one which works almost perfectly:
2 layouts in 1 > make bottom GONE > onClick - make bottom VISIBLE and apply slide up on entire Bar > onClick - apply slide down on Bar and make bottom GONE
Below is the onClick code:
mInfoBar = (RelativeLayout) mRootView.findViewById(R.id.infoBar);
mInfoBottomRow = (RelativeLayout) mRootView.findViewById(R.id.infoBottomRow);
mBtnExpand.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
if (mInfoBottomRow.getVisibility() == View.GONE) {
mInfoBottomRow.setVisibility(View.VISIBLE);
TranslateAnimation slideUp = new TranslateAnimation(0, 0, mInfoBottomRow.getHeight(), 0);
slideUp.setDuration(200);
mInfoBar.startAnimation(slideUp);
} else {
TranslateAnimation slideDown = new TranslateAnimation(0, 0, 0, mInfoBottomRow.getHeight());
slideDown.setDuration(200);
slideDown.setAnimationListener(new Animation.AnimationListener() {
#Override
public void onAnimationEnd(Animation animation) {
mInfoBar.clearAnimation();
mInfoBottomRow.setVisibility(View.GONE);
}
#Override
public void onAnimationRepeat(Animation animation) {
}
#Override
public void onAnimationStart(Animation animation) {
}
});
mInfoBar.startAnimation(slideDown);
}
}
});
The problem is, the very first time the button is pressed, the info bar (with both top and bottom row) snaps to its position (without the sliding effect).
All other subsequent button press works perfectly...
2nd press - the bar slides down to show the top bar resting on the bottom of the screen and the bottom row gone.
3rd press - the bar slides up to show both top and bottom row.
and so on...
Can't understand why setVisibility(VISIBLE) is snapping to view only first time, or why the sliding effect is not showing the first time.
I'd rather not change the animation implementation since it's giving me desired effect all but once.
So any insight within this will be really appreciated.

Your hiddenView's height is 0 for the first time as far as i guess. You should make visible your hiddenView in your layout.
use
android:visibility="visible"
instead of
android:visibility="gone"
in your hiddenView.
Get the height and make it gone by following code:
hiddenView.getViewTreeObserver().addOnGlobalLayoutListener(
new ViewTreeObserver.OnGlobalLayoutListener(){
#Override
public void onGlobalLayout() {
height = hiddenView.getHeight();
hiddenView.getViewTreeObserver().removeGlobalOnLayoutListener( this );
hiddenView.setVisibility( View.GONE );
}
});
Use this height to animate.. :)

Related

Android: Custom bottom sheet dialog

How can I implement following design functionality with android standard component bottom sheet:
Image when Bottom sheet dialog fragment will appear:
Image when user scrolled to up to view bottom of content:
I will use ViewPager to scrolling header images and RecyclerView to showing descriptions and other informations. And parallax effect to ImageView(which are placed in ViewPager) when scrolling content vertically. Have a minimum height of the ImageView(and ViewPager), user can't collapse fully it (Look to second screenshot, which is user scrolled until the end of content).
I want stop scrolling ImageView when it will reach to minimum height(look to second one Screenshot), but the content of below ImageView should be continue scrolling
This can be done with an if statement in an on scroll view such as shown below:
ScrollView scrollView = findViewById(R.id.scrollView); //Adjust for your code
ImageView imageView = findViewById(R.id.imageView); //Adjust for your code
boolean imageIsHidden = false;
int threshold = 250;
scrollView.getViewTreeObserver().addOnScrollChangedListener(new OnScrollChangedListener() {
#Override
public void onScrollChanged() {
int scrollY = rootScrollView.getScrollY();
if(scrollY >= threshold){
imageIsHidden = true;
//Move image outside of scroll view so it doesn't scroll
}
else if(scrollY < threshold && imageIsHidden){
imageIsHidden = false;
//Move image inside of scroll view so it does scroll
}
}
});
What this does is has a boolean called imageIsHidden and an integer called threshold. Threshold is where you want it to make it disappear. You will need to play around with this value to find a sweet spot.
You will also need to implement moving the image inside and outside of the scroll view as well in the if and if else statement.

Navigation Drawer: change selected item after replace another fragment

I'm using android default navigation drawer activity. Assume i have fragment A and fragment B, there is one button in fragment A and it will redirect(replace) from fragment A to B after the button is clicked.
But the selected item in navigation drawer is still highlighting fragment A. Is there any method to change it to highlight the fragment B instead of A?
#Override
public void onClick(View v) {
if(carplate.getText().toString().equals("")){Toast.makeText(getActivity(),"Please enter your car plate number",Toast.LENGTH_SHORT).show();}
else{
Status status = new Status();
FragmentManager fragmentManager = getFragmentManager();
android.support.v4.app.FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
fragmentTransaction.replace(R.id.content_frame,status);
fragmentTransaction.addToBackStack(null);
fragmentTransaction.commit();
}
}
this function is under fragment A. I need the selected item automatic change to fragment B(Status) after i pressed the button in fragment A.
yes it is very easy
first, you have to get Navigation View and then get the menu from that navigation view and high light/show selection on the basis of the item index which is start from the 0. Place the following line of code in the onclick method.
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.getMenu().getItem(0).setChecked(true);
and if you want to open the fragment use the following lines of code with the stated code lines
getSupportFragmentManager().beginTransaction()
.replace(R.id.mainFragment,new yourNewFragment()).commit()
I hope this is helping

How can I add button to top right corner of a Dialog In libgdx?

I want to add close button to top right corner of a dialog box.
I tried using setbounds with addactor and just add and setposition with setsize and addactor, but nothing works. I know that dialog works with table layout, it has a table for content and for buttons. I don't want to use this layout and put the button outside this layout like on the border of the dialog.
How can I do it?
This is how it should be:
The easiest solution I could come up with now, is to use negative padding for your button to move it "outside" of it's cell.
Button closeButton = new TextButton("X", skin, "default");
getTitleTable().add(closeButton).size(60, 40).padRight(-30).padTop(-20);
With this padding hack you have the problem, that the button will be outside of your Dialog, and by default, Window checks the bounds of your window when it performs Actor.hit(...) evaluation.
We need to disable clipping for that reason, but the rendering of the window depends on it. That's why we use another hack to enable it, just for the rendering:
#Override
public void draw(Batch batch, float parentAlpha) {
setClip(true);
super.draw(batch, parentAlpha);
setClip(false);
}
Do this:
private Stage stage;
private Window window;
private Table table;
#Override
public void show() {
table = new Table();
table.setSize(Gdx.graphics.getWidth() / 2
, Gdx.graphics.getHeight() / 5);
window = new Window("", skin);
window.setSize(table.getWidth(), table.getHeight());
Button btnWindow = new Button(skin, "close");
btnWindow.addListener(new ClickListener() {
#Override
public void clicked(InputEvent event, float x, float y) {
window.setVisible(false);
}
});
window.addActor(btnWindow);
btnWindow.setSize(50, 50);
btnWindow.setPosition(window.getWidth() - btnWindow.getWidth()
, window.getHeight() - btnWindow.getHeight());
table.addActor(window);
window.setModal(true);
table.setPosition(Gdx.graphics.getWidth() / 2 - window.getWidth() / 2
, Gdx.graphics.getHeight() / 2 - window.getHeight() / 2 +
100);
window.addAction(Actions.sequence(Actions.alpha(0)
, Actions.fadeIn(.1f)
, Actions.moveTo(+50, +50, 1)));
stage.addActor(table);
}
I had a similar problem. After a bit of searching this thread helped me.
Basically to tell the alignment of the actors inside a table, and to tell the alignment of the table itself are two separate things. Setting the alignment of the table top top-left would produce the desired behavior.
table = new Table();
table.setFillParent(true);
table.setSkin(usedSkin);
table.setDebug(true);
table.top().left();
stage.addActor(table);
table.add(exitBtn);

Resetting scroll bar in JavaFX on button click

I have used two scroll bars for controlling brightness and contrast on image after the use i want to reset the scroll bars to their initial value with a button click
I am not getting any links for that to reset scroll bars on button clicks in JavaFX?
The question somewhat unclear. Need explanation of "not getting any links". Some sample code would be helpful. Based on an assumption, try this:
final ScrollBar scrollBar = new ScrollBar();
Button btn = new Button("Reset");
btn.setOnAction(new EventHandler<ActionEvent>() {
#Override
public void handle(ActionEvent event) {
scrollBar.setValue(scrollBar.getMin());
// Or if you have stored initial value somewhere use it
scrollBar.setValue(myInitialValue);
}
});

Eclipse rcp layout issue

I am facing an issue with editor and its contents layout. Its following: there is an editor with print preview functionality, main part of the editor is taken by paper clips PrintPreview component, on the left side there is a composite with some buttons (see screenshot 1).
As you can see PrintPreview is located inside ScrolledComposite.
The problem is: when I am resizing window or views under editor, the bottom scrollbar moves under views and thus disappears. There is no way to scroll horizontally afterwards (no editor scrollbar appears). see screenshot2 (bottom scrollbar is getting hidden).
It starting to get hidden, when editor height is less then height of the right composite ( there are more widgets below the last button, I've just erased them)
If I am shrinking the window, then right composite never loses its width and always visible (see screenshot 3 - It does not allow to resize more than that).
The composites are created in the following way:
#Override
public void createPartControl(final Composite parent) {
GridLayout gridLayout = new GridLayout(2, false);
parent.setLayout(gridLayout);
// Scroll area for the print area
scroll = new ScrolledComposite(parent, SWT.BORDER | SWT.H_SCROLL | SWT.V_SCROLL);
final GridData gridData = new GridData(GridData.FILL_BOTH);
gridData.grabExcessHorizontalSpace = true;
gridData.grabExcessVerticalSpace = true;
gridData.widthHint = 1;
gridData.heightHint = 1;
scroll.setLayoutData(gridData);
scroll.setExpandHorizontal(true);
scroll.setExpandVertical(true);
// Button area
final Composite buttonArea = new Composite(parent, SWT.FLAT);
final GridData layoutData = new GridData(SWT.FILL, SWT.TOP, false, false);
buttonArea.setLayoutData(layoutData);
gridLayout = new GridLayout(1, false);
buttonArea.setLayout(gridLayout);
The question is: how not to prevent disappearing of the bottom scrollbar? Can I have the same behavior as width the width of the right composite - It not possible to resize less then right composite height? Or how can I show scrollbar on the whole editor if some minimum height limit is exceeded?
I've tried different things on different composites, like setting minimumHeight and heightHint, putting buttonsArea into the scrolledcomposite (just for fun) etc. But nothing have helped me.
Does anybody knows fast solution? Thank you.
See this SO post: Prevent SWT scrolledComposite from eating part of it's children
You need to listen for width changes on the content composite
(mParent), compute the minimum height again given the new content
width, and call setMinHeight() on the scrolled composite with new
height.
If the above post is not as useful as it seems then share some minimal compiling and executable code to replicate the problem. Also, mention the eclipse/swt version, OS and JDK version, it helps in analyzing the problem.
Demo code for resize event and output !!
Code :
import org.eclipse.swt.SWT;
import org.eclipse.swt.custom.ScrolledComposite;
import org.eclipse.swt.layout.FillLayout;
import org.eclipse.swt.layout.GridLayout;
import org.eclipse.swt.widgets.Button;
import org.eclipse.swt.widgets.Composite;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Event;
import org.eclipse.swt.widgets.Listener;
import org.eclipse.swt.widgets.Shell;
public class ScrolledCompositeTest
{
public static void main (String [] args)
{
Display display = new Display ();
Shell shell = new Shell (display);
shell.setLayout(new FillLayout());
GridLayout layout = new GridLayout();
layout.numColumns = 4;
// set the minimum width and height of the scrolled content - method 2
final ScrolledComposite sc2 = new ScrolledComposite(shell, SWT.H_SCROLL | SWT.V_SCROLL | SWT.BORDER);
sc2.setExpandHorizontal(true);
sc2.setExpandVertical(true);
final Composite c2 = new Composite(sc2, SWT.NONE);
sc2.setContent(c2);
layout = new GridLayout();
layout.numColumns = 7;
c2.setLayout(layout);
Button b2 = new Button (c2, SWT.PUSH);
b2.setText("first button");
sc2.setMinSize(c2.computeSize(SWT.DEFAULT, SWT.DEFAULT));
Button add = new Button (shell, SWT.PUSH);
add.setText("add children");
final int[] index = new int[]{0};
add.addListener(SWT.Selection, new Listener() {
public void handleEvent(Event e) {
index[0]++;
Button button = new Button(c2, SWT.PUSH);
button.setText("button "+index[0]);
sc2.setMinSize(c2.computeSize(SWT.DEFAULT, SWT.DEFAULT));
c2.layout();
}
});
shell.open ();
while (!shell.isDisposed ()) {
if (!display.readAndDispatch ()) display.sleep ();
}
display.dispose ();
}
}
Output:
Actual Size
Vertical Resize
Horizontal Resize

Resources