Set Theory Visualizer
Build an app that performs set operations — union, intersection, difference, symmetric difference, complement, power set — and displays results clearly.
🎯 Learning Goals
- ▹ Master Union, Intersection, and Complement logic
- ▹ Understand Cardinality and Membership in sets
- ▹ Implement Power Set and Subset checking algorithms
- ▹ Build logic to eliminate duplicates from lists
🌎 Why This Matters
Set theory is the foundation of modern database management (SQL). Every time you filter products on Amazon or search for friends on Instagram, you are using set operations like Intersection and Union. Understanding sets is understanding how information is organized.
📖Understanding Set Theory
Theory MasterclassA set is a well-defined collection of distinct objects. Sets are fundamental to all of mathematics. Notation: A = {1, 2, 3, 4, 5}, B = {3, 4, 5, 6, 7} Union (A ∪ B): All elements in A or B or both. A ∪ B = {1, 2, 3, 4, 5, 6, 7} Intersection (A ∩ B): Only elements in both A and B. A ∩ B = {3, 4, 5} Difference (A - B): Elements in A but not in B. A - B = {1, 2} Symmetric Difference (A △ B): Elements in either A or B but not both. A △ B = {1, 2, 6, 7} Complement (A'): All elements in the universal set that are not in A. Cardinality: The number of elements. |A| = 5 Subset: A ⊆ B if every element of A is also in B. Power Set: The set of all subsets of A. If |A| = n, then |P(A)| = 2ⁿ. For A = {1, 2}: P(A) = {∅, {1}, {2}, {1,2}} — has 2² = 4 elements.
Mathematical Foundation
🎨Part A — Designer View (UI Design)
Open MIT App Inventor → Switch to Designer view. Follow each step below to build the interface.
1. Basic UI Layout
• Set **Screen1** title to "Set Theory Visualizer". • Set **AlignHorizontal** to Center. • Set **BackgroundColor** to Black.
2. Set Inputs
• Drag 2 **Labels** and 2 **TextBoxes**. • Rename TextBoxes to 'SetATxt' and 'SetBTxt'. • Set **Hint** to "e.g. 1, 2, 3" and **Width** to 'Fill Parent'. • Ensure **NumbersOnly** is NOT checked (we need commas).
3. Action Buttons
• Drag a **HorizontalArrangement**. • Drag 3 **Buttons** inside. • Rename: 'UnionBtn', 'IntersectBtn', 'DiffBtn'. • Change text to "UNION", "INTERSECT", "A - B". • Use bright, distinct colors for each.
4. Result Display
• Drag a **Label** to the bottom. • Rename it to 'ResultLbl'. • Set **FontSize** to 20 and **Text** to "Set outcome will appear here".
🧩Part B — Blocks View (Logic & Calculation)
Switch to Blocks view. Now add the logic that makes your app actually work.
1. Switch to Blocks
• Click the **Blocks** button at the top right of your screen.
2. Building the Intersection
• Drag 'when IntersectBtn.Click' (Gold). • Go to the **Lists** drawer (Light Blue). Drag 'create empty list' and snap it to a 'set result' block. • Go to the **Control** drawer (Orange). Drag 'for each item in list'. • For every item in Set A, check 'if item is in list Set B' (use the 'is in list' block from **Lists**). • If true, add the item to your result list.
3. Displaying the Result
• Go to **ResultLbl**. Drag 'set ResultLbl.Text to'. • Go to the **Text** drawer (Bright Pink). Drag a 'join' block. • Join "A ∩ B = {" with your result list and then "}".
4. Avoiding Errors
• If the user forgets to type anything, show an error. • Use an 'if...then' (Orange Control) at the start. • Check: 'if [SetATxt.Text] is empty' (Pink Text drawer). • Then use a **Notifier** block to show a popup message.
🧪Testing Your App
- ✓A={1,2,3}, B={3,4,5} → Union={1,2,3,4,5}, Intersection={3}
- ✓A={1,2}, Universal={1,2,3,4} → A'={3,4}
- ✓A={1,2}, B={1,2,3} → A⊆B is True
- ✓Power set of {1,2} = {∅, {1}, {2}, {1,2}} — 4 subsets
- ✓Test with duplicate input: {1,2,2,3} should become {1,2,3}
🚀Bonus Challenges
Extra credit — impress your instructor
- ★Draw a simple Venn diagram on Canvas showing A and B
- ★Add De Morgan's Law verification: (A∪B)' = A'∩B'
- ★Support numeric and text elements (e.g., {apple, banana})
- ★Add Cartesian Product: A × B = {(a,b) : a∈A, b∈B}