I started to develop a mobile app using nativescript, everything was going well until I realized I cant customize the style as I want. Just for example I cant set the border to a button like border-width: 1 0 0 1.
There is a way to extend the styling behavior?
I'm considering to start using ionic :(
As of NativeScrtip version 2.4.0 (the next release), this functionality will be available, which means that you will be able to create a border with
border-width:0 2 2 0;
border-color: red;
If you want to test it now (before the release of 2.4.0) then remove tns-core-modules and install the #next version.
tns plugin remove tns-core-modules
tns plugin add tns-core-modules#next
You can also take a look at this issue to see what you can do with the new borders implementation
As of right now per side borders are not available with the css subset NativeScript exposes. They are a PITA to do on iOS, the good news is the core team knows this and I believe it's been prioritized in recent weeks. So I expect it will be possible in a release coming up.
With all that said, if you have a specific case you want you can still achieve it with NativeScript but it's not as easy as the css border styling. Just remember the css stylers in NativeScript are being mapped to the native methods/properties to style native components, so it's awesome to be able to use css even though its not 1-1 with the vast css that browsers have, it does get better every release
If you want to do a per side borders right now you can use a stacklayout with a height of 1 and set the background color. So for a 4 sided object you would use a grid layout and put a stack on the first and third row, your component on the middle (2nd) row and then a stack on the first and 3 columns (0 & 1 values). Again, I know it's not ideal but it's just a limitation for now that its not exposed in the css subset for NativeScript. I haven't checked the source or issues for any updates on this in a while but its possible something is being worked on now to enable this functionality. Hope this helps some. If you have some code and need help please share and I can help more.
Related
I cannot see me sprites in the design view. I see kind of a splash screen with Qml2Puppet, but what for? The more I got to see is this:
How to see the sprites on design view in newer qt versions? In previous version (5.xxx) I was able to see directly, in new one (7.xxx) cant.
I cannot see text or grab elements neither.
I have finalized my project and my mistake was that I left auto-layout to be done at the end, now I'm stucked in it and can't find anyway through to finalize my project.
My project layout was made based on Iphone 7 plus "xcode 8" and has 7 viewcontrollers. when I try to put constraints, the whole project collapse.
Anyone can support with any best practice that can help ?
It doesn't matter what device size you are viewing in xcode. Its default for all size classes. If you want to make different layout for specific size class than you use variations. Check this tutorial https://makeapppie.com/2016/09/05/an-introduction-to-size-classes-for-xcode-8/
I was thinking of a small layout that slides up from the bottom of the
page and disappears after sometime.
There is this plugin I've worked on for the Material Design Snackbar: https://github.com/bradmartin/nativescript-snackbar
There is also the Toast plugin: https://github.com/TobiasHennig/nativescript-toast at one time the plugin dropped iOS support but it looks like a recent contribution was made to fix the iOS version. Since there is not a native toast for iOS from apple, this plugin uses a cocoapod for that platform it looks like.
If you wanted to use your own visuals you could always create a layout that's positioned off the screen using the translate (x) or (y) and then animate it into the view when you want and out after a set time. The possibilites are limitless really.
Firefox 31 has changed my web console layout and I can't find the option to change it back. Being that I have a widescreen monitor I prefer the console to the right. When I select an array/object to view it opens it in a split as expected, but ever since the update I can't get the split to stack them vertically so they can use more width. Am I just not seeing this option?
Update: For Firefox up to v33 use this plugin, for 34+ behavior has changed. Read this thread on Bugzilla for details: https://bugzilla.mozilla.org/show_bug.cgi?id=1084004
This was added in Firefox 34, now in Beta. It is not in Firefox 33, the current release.
If you have the toolbox docked to the side, the Object Viewer pane will automatically drop to the bottom if the toolbox gets too narrow, see this gif for a visual example:
No, you are not missing the option. The option does not exist.
However, here is a quick-and-dirty extension that does what you want for Firefox 31.0 through 34.0:
http://www.mediafire.com/download/oxt4c5o5vypca85/place-webconsole-object-view-vertical%40makyen.foo.xpi
I tested it on Firefox 31.0, 32.0.1, 32.0.2, 33.0b4 (current beta), and 34.0a2 (Aurora, the current alpha). All of them worked. The file the extension changes, webconsole.xul, has 4 slightly different versions in that range of Firefox releases. One of the changes was between 32.0.1 and 32.0.2.
I had another extension for which I was already working on a similar set of compatibility and testing and then Mozilla released FF 32.0.2 today. Leaving this solution as only compatible for 31.0-32.0.1 just didn't sit well with me, so I did the mods to give it the wider compatibility range.
In 34.0a2 the stock behavior of this part of the webconsole is a bit different. The object view automatically shifts from vertical to horizontal depending on how wide the devtools sidebar is. Visually, this is similar to how the inspector behaves in 31.0 (and later). The above extension, when installed on 34.0b, will lock it in the vertical position. Personally, I really don't like the auto-choosing of vertical/horizontal. I would want a control and be able to lock it the way I want it when I am viewing it. This is not supposed to be a glitzy wiz-bang UI thing to get the masses interested. This is a: I want to get my work done now and I want it my way because that's how I work fastest/best. Sorry, I got up on my soapbox there a bit.
It's the icon that has a rectangle at the bottom. In your case (Where the yellow arrow points):
I've just downloaded the latest Nivo slider 3.2 as I need it on a responsive site and out of the box with no modifications the transitions in ie7 and ie8 don't work.
They simply flick between images - no sliceDown or Fade they just rotate.
I've used it in the past with no problems - I've just view 2.6 in ie7 and ie8 and it's fine.
Does anyone know what can be done to fix it?
I've just checked out their demo too http://nivo.dev7studios.com/responsive-demo/ and the same issue is happening there.
Cheers
Just sharing what worked on my site -- I was using the default demo code, pretty much unedited from the download. It was beautiful and responsive (which I wanted) in all of the browsers I tested, except any version of i.e.. If i.e., it was just a rotation, no effects.
However, when I designated a size dimension for the wrapper div and the image divs, the transitions worked in i.e. also. (height: 350px;) You can specify the dimension in your css/stylesheet or inline -- if that's what it takes.
On my site, I only needed to specify a height dimension; for your site, you might need both height and width, or just width. A little experimentation was all it took.
But, with the height dimension specified, this threw off the display in the other browsers, so the dimension needs to be specified in terms of a "hack" for internet explorer: either a separate stylesheet just for internet explorer users or by using whatever your favorite internet explorer hacking method is: underscore, or \9, and so on. Here's a list of useful internet explorer workarounds, just for reference: internet explorer hacks
I know we hate to recommend hacking, but we all do it :). Would love to find out why this one worked for me, maybe there's a better way without the hack.