dijit toolbar on the left side instead on top - dojo

so I didn't find something in the dijit Toolbar API I'll try it here.
Is it possible to place a dijit toolbar to another place than on top?
I'd like to create a Toolbar declarativly on the left side inside a contentpane so the toolbar is from top left, to bottom left.
Is there a way to do it?

Well if you go with declarative approach for widget creation, you can write custom css for each of them .
So getting a custom layout doesnt seem to be a tough task. You can write some div container's with a fix width , break line after each menu item and get the required layout.
check this for example:
https://jsfiddle.net/GfB2B/2/

Related

QT designer layout inside layout

I am not able to design below layout in qt -designer
So under main window , we have one horizontal Layout that have two vertical Layout and each vertical Layout have.
one horizontal Layout that contains combo box and push button
And another Listview widget
Since you didn't include any information about what steps you followed in trying to create this layout and what the final result was, it's impossible to tell where things go wrong. However, to create the layout as described in the post, you could do the following.
Step 1: Add widgets to form
In a new form in Qt Designer, roughly place the widgets where you want them to be in the final layout.
Step 2: Add widgets to layouts
Add widgets to layouts starting with the deepest nested widgets. In this case that would be the comboboxes and push buttons. To add a push-button and combobox to a layout, select both push-button and combobox, either in the layout itself or in the object inspector, right-click on the selection and select lay out > lay out horizontally in the context menu.
Repeat these steps for the other widgets and layouts. When adding the horizontal layout and the list view to a vertical layout, make sure you select the layout and not one of the widgets in the layout:
Step 3: Set layout of main window
To set the layout of the main window, right-click either anywhere in the main area of the form outside of any child widget or on the MainWindow node in the object inspector and select layout > lay out horizontally. This should result in something like this
And the object tree in the object inspector will look something like this

update KeyboardAvoidingView after a layout change

I have a form in my app that has a floating bar with buttons that animates into the view at the bottom of the window when the user makes any change to any of the data in the form. I have this bar rendering relative to the height of the window so it knows when the keyboard is open or closed and will attach to wherever the bottom of the view window is at any give time.
The issue I have is the form is wrapped in a KeyboardAvoidingView around the form with a behavior of padding and this all works great, however when I make my change and my floating button bar comes up, because the input is at the bottom of the window the bar now covers up the input I'm typing in.
I haven't been able to find a way to fix this yet. I tried disabling the KeyboardAvoidingView I assume that maybe I need to somehow tell the view about this bar that's covering up part of the view but I'm not sure how I do that.
here is a snapshot of what this looks like for reference...

UWP menu without hamburger

This is my first UWP app
I have a SplitView. On the right side I want a menu. On the left side I want to be able to load different pages into it(frame)
The only menu I can find have that hamburger in it(AppBarButton).
This app will only run on windows desktop machines so I do not have need of the hamburger and it will be rather useless.
I have spent the last two nights looking for options but all I get are hamburgers.
Can someone please point me to an example of a no hamburger menu or a tutorial of some kind?
I am sure I can figure it out once I know what elements to use, I just need a push in the correct direction.
What you need is a base page (let's call it "HostView") this will simply have a SplitView control with the DisplayMode set to Inline and the IsPaneOpen set to true. You can also set the side panel width by using the OpenPaneLength property.
Your menu buttons go into the SplitView.Pane and you place a Frame control in the SplitView.Content. This frame will navigate to the correct page when a menu item is selected.
If you set the properties as I said above then you will not need a Hamburger menu to open the side panel at all. However, please consider the fact that users will want to resize your app, and they might resize to a very narrow size which means it might not have enough space to display all the content. IN which case you will need to collapse the side panel and show a hamburger menu to open it when needed. You don't have to do this, but it is something to consider.

Working with large views in Xcode and Interface Builder

I am new to Xcode and I'm currently working with a view which is rather large. I am using a scroll view which works perfectly when I run the application, however I find it difficult to work with such a large view in interface builder. Is there any tricks such as making the working area in Interface Builder larger? Or should I simply stop using interface builder and instantiate the GUI-components programatically?
You can change your view size to freeform and set its size to anything you like just for looking at it and then set it back to its original size
There are buttons in the upper right corner of the project window toolbar that will hide the navigator and inspector.
Click the left button to hide the navigator. Click the right button to hide the inspector. Hiding the navigator and inspector will give you more room for the Interface Builder canvas. I recommend starting by hiding the navigator because Interface Builder uses the inspector for many tasks.
Another way to get more room for the canvas is to use the icon view for the object list, which is to the left of the canvas. There is a button in the lower left corner of the canvas that toggles the icon and hierarchical views of the object list.

jQuery Animate Toggle - Animation only works on second click

Task: I wanted to create a simple share button which extends to a share section (F,T,G,P) when clicked.
I failed to let the section slide out of the share button - what I really, really wanted - but managed to let a separate ul element slide out on the right side.
The animation worked… until I set the ul to hide initially via $('.networks').hide();
The sections is intended to only show up after a click, but now after the first click it just "pops open" ignoring the configured slide-out. Sliding only works in both directions (open and close) after clicking on it at least once .
I've uploaded an Example here at Codepen.io and as a jsFiddle.
Side note: the demos are behaving a little bit strange since they appear to only show a slide-in fx. The slide-out fx, with which we start, always looks like it pops open - that's not the case, it works after the second click, so you got to focus your eyes to see it (on a normal browser it visibly works better).
PS: Bonus points if you help me make this slide out of the "share" button. Be aware that I only have rudimentary knowledge of Javascript ( * duck and run * ).
Take a look at this fiddle link.
I changed the display property of the buttons to be inline-block instead of inline.
Elements with display inline can not have a width and i think it was the reason why jQuery was not able to animates the Elements width. I also animated the wrap around the ul instead of the ul.
EDIT: made a fast mockup of the thing sliding out of the button. Changed some css to be on the list elements itself instead of on the a elements, just work through the css and I think it will look ok.
edit forgot the link: link