Architecture - Part 1 - Transcript.pdf
- 1. Architecture - Part I Up until now we focused on the visual aspect of the application without giving much thought to the architecture. Sometimes we start by designing the model or underlying logic and sometimes we take a more top down approach. In mobile I like starting with the UI design as this is such an important part of the product experience.
- 2. Architecture ✦Up until now the UI was pure mockup, we’ll start breaking it down into logical pieces by separating the business from the UI ✦The first step is figuring out the different pieces involved ✦The second step is integrating them into the code ✦Architecture is a process - we create an architecture by need and refine it as we move forward © Codename One 2017 all rights reserved We’ll start by breaking the UI & business logic apart The first step is understanding the pieces that are involved in the backend model We then need to integrate that model data into the UI code and decide on the right point of separation between the model and the UI I don’t spend much time in front of a whiteboard drawing architectural diagrams. Architecture is usually an iterative process where I can adapt the design to match the evolving needs.
- 3. Menu Order Where do we Start? ✦I’ve discussed the Dish class the last time around so lets start from that point… © Codename One 2017 all rights reserved Dish Good architecture starts with necessity. I needed the dish class to represent the data model before and now it’s a great point to begin with.
- 4. Where do we get a Dish from? ✦A dish is a part of a menu which happens to match out exact UI paradigm… But it’s also part of an order! © Codename One 2017 all rights reserved Dish Menu Order 1 1 * * Our UI already communicated some of the necessity from the model. Dish is obvious but the main UI maps perfectly to a restaurant menu. The checkout UI maps to a specific order which we should also represent within the model
- 5. Where do we get a Dish from? ✦Where do we get those from? From the Restaurant… © Codename One 2017 all rights reserved Dish Menu Order Restaurant 1 1 * * 1 1 1 1 We need a global state that contains the menu, current order etc. This object can be represented by a restaurant object to which we can push a few other variables into that object.
- 6. public class Menu implements PropertyBusinessObject { public final ListProperty<Dish, Menu> dishes = new ListProperty<>("dishes"); public final ListProperty<String, Menu> categories = new ListProperty<>("categories"); private final PropertyIndex idx = new PropertyIndex(this, "Menu", dishes, categories); @Override public PropertyIndex getPropertyIndex() { return idx; } } Menu The menu object is simple, it includes a list of dishes and categories. There isn’t much here…
- 7. public class Order implements PropertyBusinessObject { public final Property<String, Order> id = new Property<>("id"); public final Property<Date, Order> date = new Property<>(“date”, Date.class); public final BooleanProperty<Order> purchased = new BooleanProperty<>("purchased"); public final MapProperty<Dish, Integer, Order> dishesQuantity = new MapProperty<>("dishesQuantity"); public final Property<String, Order> notes = new Property<>("notes"); private final PropertyIndex idx = new PropertyIndex(this, "Order", id, date, purchased, dishesQuantity, notes); @Override public PropertyIndex getPropertyIndex() { return idx; } } Order Order is also pretty self explanatory. Notice that the menu object didn’t have an ID while the order has an ID. We have one menu for the app so an ID isn’t really necessary but we can have multiple orders and might want to keep a record of each order. Also notice I used a string for an id rather than a numeric ID which allows more flexibility in id generation. Dishes are stored in a Map to quantity which might not be the best data model but it works, this necessitates an equals and hashCode method implementation on Dish
- 8. public class Restaurant implements PropertyBusinessObject { public final Property<String, Restaurant> name = new Property<>("name"); public final Property<String, Restaurant> tagline = new Property<>("tagline"); public final Property<Image, Restaurant> logo = new Property<>("logo"); public final DoubleProperty<Restaurant> latitude = new DoubleProperty<>("latitude", 0.0); public final DoubleProperty<Restaurant> longitude = new DoubleProperty<>("longitude", 0.0); public final Property<String, Restaurant> navigationAddress = new Property<>("navigationAddress"); public final Property<String, Restaurant> address = new Property<>("address"); public final Property<String, Restaurant> phone = new Property<>("phone"); public final Property<String, Restaurant> website = new Property<>("website"); public final Property<String, Restaurant> currency = new Property<>("currency"); public final Property<Menu, Restaurant> menu = new Property<>("menu", new Menu()); public final Property<Order, Restaurant> cart = new Property<>("order", new Order()); private final PropertyIndex idx = new PropertyIndex(this, "Restaurant", name, tagline, logo, latitude, longitude, navigationAddress, address, phone, website, currency, menu, cart); @Override public PropertyIndex getPropertyIndex() { return idx; } Restaurant The restaurant object is a singleton for simplicities sake at least at this point. Most of the details I need in the app from the name of the restaurant to its location are all within this object. This is important as it provides us with the necessary flexibility and allows us to adapt the app to fit any restaurant we want without code changes.
- 9. private Restaurant(Properties p, Image img) { name.set(p.getProperty(name.getName())); tagline.set(p.getProperty(tagline.getName())); latitude.set(Double.valueOf(p.getProperty(latitude.getName()))); longitude.set(Double.valueOf(p.getProperty(longitude.getName()))); navigationAddress.set(p.getProperty(navigationAddress.getName())); address.set(p.getProperty(address.getName())); phone.set(p.getProperty(phone.getName())); website.set(p.getProperty(website.getName())); currency.set(p.getProperty(currency.getName())); logo.set(img); // Default hardcoded values e.g. list of Dish's menu.get(). categories.add("Entru00e9e"). categories.add("Mains"). categories.add("Deserts"). categories.add("Wines"). categories.add("Beverages"); Dish dsh = new Dish().name.set("My great dish"). description.set("Lorem ipsum dolor sit amet, consectetur adipiscing elit. " + "Maecenas pharetra leo quis sapien rutrum scelerisque. Aenean Restaurant We initialize the restaurant properties in the constructor, I’ve snipped this a bit to keep it narrow but generally we set the values from a properties file so we can customize this easily. I hardcoded the menu and dishes at this point so we don’t need to deal with the complexities related to this set of features.
- 10. private static Restaurant instance; public static Restaurant getInstance() { if(instance == null) { try(InputStream io = Display.getInstance(). getResourceAsStream(Restaurant.class, "/settings.properties")) { Properties p = new Properties(); p.load(io); Image img = Image.createImage("/logo.png"); instance = new Restaurant(p, img); } catch(IOException err) { Log.e(err); } } return instance; } public String formatCurrency(double value) { return currency.get() + L10NManager.getInstance().format(value); } Restaurant As I mentioned before the restaurant is a singleton, I load the values for it from a properties file within the app at this point