marcofolio.net - Archives (décembre 2017)

design, jquery, programming, webdevelopment, fun, php, html, css, javascript

Le: 29 12 2017 à 21:08 Auteur: Marco

For my final post of the year, I wanted to do something fun and decided to create a chatbot that creates memes. You’ve probably seen them before in the form of image macro’s with the typical top text and bottom text. This chatbot (called the MemeBot) is built with the Bot Framework and a fun way to see what the framework can do. MemeBot can simply create images like these: In this post, you’ll learn: How to consume the RapidAPI, which is used to generate the images. How to send embedded images through the Bot Framework. Dive directly in the code on Github or learn step-by-step by reading on! Setup The idea is simple: Let the user select a meme, set some top text and bottom text and let the bot generate the image. Before we continue, make sure you have an account on RapidAPI to make use of the Meme Generator. I selected the BASIC-pricing tier which is free. This bot doesn’t make use of LUIS, but does use Prompt Dialogs. The meme API To generate the memes, we’ll be using the APIMeme through RapidAPI. Although this API supports many memes, for this sample I made a small preselection.

The post Generating Meme images through a Bot appeared first on Marcofolio.net.

Le: 12 12 2017 à 19:01 Auteur: Marco

Back in 2013, I wrote an article called “CSS animated profile cards“. It showed how to create different kind of animations using HTML and CSS animation. Now, I wanted to take that same concept but apply it on an app build with Xamarin.Forms. Luckily, the Xamarin.Forms Animations will help us achieve that! I created four animations (Push, Slide, 3D Flip and Explode) and applied them to profile cards. So, how can you create this effect for yourself? The source code can be found on Github in case you directly want to dive into the code. Otherwise, read on! Since we’re using Xamarin.Forms, these animations work perfectly on iOS and Android. The setup I actually took the HTML/CSS as input for the animation styles. The setup is a base class with a an Picture and a Profile that are placed “on top” of each other. On top of that, there’s another invisible frame that can receive the Tap-events using a TapGestureRecognizer. These are simply all the elements we need in order to make the animations work. When looking at the code in the ProfileCardBase-class, this would be the heart that does the magic. Check out the full implementation as well. public abstract

The post Xamarin.Forms animated profile cards appeared first on Marcofolio.net.