I have just discovered cloudinary and I am making a website where I am trying to make several sections of the page with different background images to be responsive by size as well by format for older browsers.
I have set up React SDK and with AdvancedImage I am getting responsive images.
My question is it possible to set up the AdvancedImage to be background image?
Or for the background images I have to set functions for the screen width and in which browser the page is viewed to set manually the screen width and format to include into url when requesting an image from cloudinary?
Or should I get the image using the AdvancedImage and place it as absolute in the container?
I was googling and checking the documentation of cloudinary with no luck.
Related
I have the next question. I am developing a react application with some images. The user has the possibility to click and open a full-page image. Because the image's orientation is horizontal on the mobile, it does not look good. My idea is when the user clicks on the full page icon, the orientation of the phone becomes horizontal as is implemented on youtube. I tried to find some information about that, but I am not sure if it is even possible, I saw that only by using react native and developing mobile applications you can have access to the user's orientation of the screen. But maybe there are some methods to do in the browser? Thanks in advance.
It is not possible to change this from the web, however you could simply rotate the image and display it full screen. This has been done here:
CSS Rotate Portrait Image 90 Degrees and Make Image Full Screen
I am currently experimenting on a hybrid app using ReactJS for my front-end loaded inside an Android WebView. On one of the pages, I have a list that loads an external/hosted image. Tapping on these images routes to another page that shows its description (using react-router. history=hashHistory).
Testing on the browser(chrome), the images appear once loaded. On the other hand, testing on the actual device, the images does not appear. Only when I tap the list item and press back (hashHistory.goBack) that it appears.
I know this is not the best use for ReactJS, but this is better than what we are currently using. Also, our current setup prevents us from pursuing the React Native way. Any ideas?
EDIT:
here's a screen cap:
You need to change your websettings in your code.
WebSettings settings = webView.getSettings();
settings.setDomStorageEnabled(true);
Is there a way to generate thumbnail like images from a stored video in codename one?
I have a codename list that uses the generic renderer and has a list of strings which are a local path to either a video or an image. Is there a way to display either the image or a thumbnail of the video on the multiButton icon?
You’ll need to use a native interface. Looks like both iOS and Android support thumbnails from video.
Getting a thumbnail from a video url or data in iPhone SDK
How to create video thumbnail from video file path in Android
You could also do it server-side and then load the thumbnails from your app. E.g. Cloudinary supports generating video thumbnails.
http://cloudinary.com/documentation/video_manipulation_and_delivery
The Cloudinary cn1lib is available here:
https://github.com/shannah/cloudinary-codenameone
I use Ionic for my iOS hybrid application,
I want to create a custom header and use a background image for all pages.
I want to know is there any way to create a master page in Ionic + AngularJS for using in another pages?
The answer varies depending on how you've already setup your app. Probably the simplest approach is to use a background image with CSS on the body of the page. That is just one line of CSS, but you'll have to consider how that image works or displays on various device sizes or if your app is in portrait or landscape mode.
I want to make a javascript image gallery
(with 6 thumbnails in a row and as many rows as fit the page.
clicking the thumbnails will bring up a popup box with images and a video)
At the bottom of the page there is a numbered pagination.
However, I would like to make it so that on a mobile platform (android/iphone)
the user can paginate by swiping the pages to go forward or backward.
How do I adjust the pagination for a mobile platform?
Should I use a specific crossplatform tool like sencha to make this gallery?
Have you thought about using JQuery Mobile ?
http://jquerymobile.com/