Skip to content

Commit

Permalink
Fix BrowsingMenu layout (#3712)
Browse files Browse the repository at this point in the history 
<!--
Note: This checklist is a reminder of our shared engineering
expectations. Feel free to change it, although assigning a GitHub
reviewer and the items in bold are required.

⚠️ If you're an external contributor, please file an issue first before
working on a PR, as we can't guarantee that we will accept your changes
if they haven't been discussed ahead of time. Thanks!
-->

Task/Issue URL:
https://app.asana.com/0/414709148257752/1208946169184139/f
Tech Design URL:
CC:

**Description**:

Adjusts layout for `BrowsingMenuButton` so that it expands along with
the label inside. Additionally `BrowsingMenuViewController` got a new
constraint preventing the menu view from going outside view bounds.

**Steps to test this PR**:
1. Enable link conditioner with a bad/slow connection profile.
2. Try to load any site, stop before it finishes loading.
3. Open menu, check if button titles are visible.
4. Load site again (without link conditioner).
5. Check browsing menu sizing and layout is as expected.
6. Go to System Settings -> Developer -> View (simulator) or Display &
Brightness -> Display Zoom (physical device) and set display zoom to
"Larger text".
7. Repeat testing steps.

<!--
Before submitting a PR, please ensure you have tested the combinations
you expect the reviewer to test, then delete configurations you *know*
do not need explicit testing.

Using a simulator where a physical device is unavailable is acceptable.
-->

**Definition of Done (Internal Only)**:

* [ ] Does this PR satisfy our [Definition of
Done](https://app.asana.com/0/1202500774821704/1207634633537039/f)?

**Orientation Testing**:

* [ ] Portrait
* [ ] Landscape

**Device Testing**:

* [x] iPhone SE (1st Gen)
* [x] iPhone 8
* [ ] iPhone X
* [x] iPhone 14 Pro
* [x] iPad

**OS Testing**:

* [ ] iOS 15
* [ ] iOS 16
* [ ] iOS 17

---
###### Internal references:
[Software Engineering
Expectations](https://app.asana.com/0/59792373528535/199064865822552)
[Technical Design
Template](https://app.asana.com/0/59792373528535/184709971311943)
  • Loading branch information
@dus7
dus7 authored Dec 19, 2024
1 parent 09f346f commit cdeddba
Show file tree
Hide file tree
Showing 3 changed files with 55 additions and 49 deletions.
39 changes: 21 additions & 18 deletions DuckDuckGo/BrowsingMenu/BrowsingMenuButton.xib
View file
Original file line number Diff line number Diff line change
@@ -1,39 +1,36 @@
<?xml version="1.0" encoding="UTF-8"?>
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="17701" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
<document type="com.apple.InterfaceBuilder3.CocoaTouch.XIB" version="3.0" toolsVersion="23504" targetRuntime="iOS.CocoaTouch" propertyAccessControl="none" useAutolayout="YES" useTraitCollections="YES" colorMatched="YES">
<device id="retina6_1" orientation="portrait" appearance="light"/>
<dependencies>
<deployment identifier="iOS"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="17703"/>
<plugIn identifier="com.apple.InterfaceBuilder.IBCocoaTouchPlugin" version="23506"/>
<capability name="System colors in document resources" minToolsVersion="11.0"/>
<capability name="documents saved in the Xcode 8 format" minToolsVersion="8.0"/>
</dependencies>
<objects>
<placeholder placeholderIdentifier="IBFilesOwner" id="-1" userLabel="File's Owner"/>
<placeholder placeholderIdentifier="IBFirstResponder" id="-2" customClass="UIResponder"/>
<view autoresizesSubviews="NO" contentMode="scaleToFill" insetsLayoutMarginsFromSafeArea="NO" translatesAutoresizingMaskIntoConstraints="NO" id="iN0-l3-epB" customClass="BrowsingMenuButton" customModule="DuckDuckGo" customModuleProvider="target">
<rect key="frame" x="0.0" y="0.0" width="70" height="86"/>
<view autoresizesSubviews="NO" contentMode="scaleToFill" horizontalCompressionResistancePriority="1000" insetsLayoutMarginsFromSafeArea="NO" translatesAutoresizingMaskIntoConstraints="NO" id="iN0-l3-epB" customClass="BrowsingMenuButton" customModule="DuckDuckGo" customModuleProvider="target">
<rect key="frame" x="0.0" y="0.0" width="73" height="85"/>
<subviews>
<view contentMode="scaleToFill" translatesAutoresizingMaskIntoConstraints="NO" id="LOb-q4-bUE">
<rect key="frame" x="3" y="3" width="64" height="80"/>
<rect key="frame" x="3" y="3" width="67" height="79"/>
<color key="backgroundColor" systemColor="systemBackgroundColor"/>
</view>
<imageView clipsSubviews="YES" userInteractionEnabled="NO" contentMode="scaleAspectFit" horizontalHuggingPriority="251" verticalHuggingPriority="251" translatesAutoresizingMaskIntoConstraints="NO" id="9Fs-Fi-0RY">
<rect key="frame" x="23" y="19" width="24" height="24"/>
<rect key="frame" x="24.5" y="20" width="24" height="24"/>
<constraints>
<constraint firstAttribute="width" constant="24" id="E0z-1N-BWl"/>
<constraint firstAttribute="height" constant="24" id="hs8-zA-JVo"/>
</constraints>
</imageView>
<label opaque="NO" userInteractionEnabled="NO" contentMode="TopLeft" horizontalHuggingPriority="251" verticalHuggingPriority="251" usesAttributedText="YES" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" minimumFontSize="13" translatesAutoresizingMaskIntoConstraints="NO" id="hw1-7w-6TO">
<rect key="frame" x="6" y="49" width="58" height="14"/>
<constraints>
<constraint firstAttribute="height" relation="lessThanOrEqual" constant="30" id="zpy-Rt-FMO"/>
</constraints>
<label opaque="NO" userInteractionEnabled="NO" contentMode="TopLeft" horizontalHuggingPriority="251" verticalHuggingPriority="251" horizontalCompressionResistancePriority="1000" usesAttributedText="YES" lineBreakMode="tailTruncation" numberOfLines="0" baselineAdjustment="alignBaselines" minimumScaleFactor="0.90000000000000002" adjustsLetterSpacingToFitWidth="YES" translatesAutoresizingMaskIntoConstraints="NO" id="hw1-7w-6TO">
<rect key="frame" x="23" y="50" width="27.5" height="15"/>
<attributedString key="attributedText">
<fragment content="Label">
<fragment content="Text">
<attributes>
<color key="NSColor" name="textColor" catalog="System" colorSpace="catalog"/>
<font key="NSFont" size="14" metaFont="system"/>
<color key="NSColor" white="1" alpha="1" colorSpace="custom" customColorSpace="calibratedWhite"/>
<font key="NSFont" metaFont="system" size="14"/>
<paragraphStyle key="NSParagraphStyle" alignment="center" lineBreakMode="truncatingTail" baseWritingDirection="natural" tighteningFactorForTruncation="0.0"/>
</attributes>
</fragment>
Expand All @@ -47,15 +44,21 @@
<bool key="isElement" value="YES"/>
</accessibility>
<constraints>
<constraint firstAttribute="bottom" secondItem="LOb-q4-bUE" secondAttribute="bottom" constant="3" id="55D-XN-Ym9"/>
<constraint firstItem="LOb-q4-bUE" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="3" id="7HI-5U-WcD"/>
<constraint firstAttribute="trailing" secondItem="LOb-q4-bUE" secondAttribute="trailing" constant="3" id="7gg-sa-eLs"/>
<constraint firstItem="hw1-7w-6TO" firstAttribute="leading" secondItem="LOb-q4-bUE" secondAttribute="leading" constant="3" id="LEv-qH-9tx"/>
<constraint firstItem="LOb-q4-bUE" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" constant="3" id="IHd-KQ-2bw"/>
<constraint firstItem="hw1-7w-6TO" firstAttribute="leading" relation="greaterThanOrEqual" secondItem="LOb-q4-bUE" secondAttribute="leading" constant="3" id="LEv-qH-9tx"/>
<constraint firstAttribute="bottom" secondItem="LOb-q4-bUE" secondAttribute="bottom" constant="3" id="MDm-Aq-L3X"/>
<constraint firstItem="LOb-q4-bUE" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" constant="3" id="NO8-nC-ozd"/>
<constraint firstItem="hw1-7w-6TO" firstAttribute="top" secondItem="9Fs-Fi-0RY" secondAttribute="bottom" constant="6" id="QIA-za-5uG"/>
<constraint firstItem="9Fs-Fi-0RY" firstAttribute="centerX" secondItem="iN0-l3-epB" secondAttribute="centerX" id="SPD-A7-yw9"/>
<constraint firstItem="9Fs-Fi-0RY" firstAttribute="centerY" secondItem="iN0-l3-epB" secondAttribute="centerY" constant="-12" id="XT0-VM-7DB"/>
<constraint firstItem="hw1-7w-6TO" firstAttribute="trailing" secondItem="LOb-q4-bUE" secondAttribute="trailing" constant="-3" id="ZWx-kh-tBq"/>
<constraint firstAttribute="bottom" secondItem="hw1-7w-6TO" secondAttribute="bottom" constant="20" id="VLe-if-xLk"/>
<constraint firstItem="LOb-q4-bUE" firstAttribute="trailing" relation="greaterThanOrEqual" secondItem="hw1-7w-6TO" secondAttribute="trailing" constant="3" id="ZWx-kh-tBq"/>
<constraint firstItem="hw1-7w-6TO" firstAttribute="centerX" secondItem="iN0-l3-epB" secondAttribute="centerX" id="bnY-r8-Owk"/>
<constraint firstAttribute="trailing" secondItem="LOb-q4-bUE" secondAttribute="trailing" constant="3" id="oNy-pg-H00"/>
<constraint firstItem="LOb-q4-bUE" firstAttribute="leading" secondItem="iN0-l3-epB" secondAttribute="leading" constant="3" id="ogG-SA-wPN"/>
<constraint firstItem="9Fs-Fi-0RY" firstAttribute="top" secondItem="iN0-l3-epB" secondAttribute="top" constant="20" id="rJ1-zN-Udy"/>
</constraints>
<nil key="simulatedTopBarMetrics"/>
<nil key="simulatedBottomBarMetrics"/>
Expand All @@ -65,7 +68,7 @@
<outlet property="image" destination="9Fs-Fi-0RY" id="Fpu-am-HAk"/>
<outlet property="label" destination="hw1-7w-6TO" id="2K5-cO-z7K"/>
</connections>
<point key="canvasLocation" x="66.666666666666671" y="75.669642857142847"/>
<point key="canvasLocation" x="67.391304347826093" y="73.995535714285708"/>
</view>
</objects>
<resources>
Expand Down
Loading

0 comments on commit cdeddba

Please sign in to comment.